I am using multisearch on my jqgrid to enable users search data from the server side.
My requirement is, I want to capture the search parameters specified by the user in the search grid as soon as they press the Find button.
Accordingly,
a. Is there any event that gets fired when a user clicks the Find button in the search grid?
b. how will I capture the search parameters specified in the search grid?
Thanks in advance.
In case anyone is looking for an answer to the above question:
I found that if we set the closeAfterSearch:true, then clicking 'Find' button triggers onClose event.
Similarly,
for Reset button, set the closeAfterReset:true, this again triggers onClose event.
jQuery("#list").jqGrid('navGrid', "#pager",{},{},{},{},
{multipleSearch:true,closeAfterSearch:true, closeAfterReset:true,
onClose:function()
{
//do work
return true; // return true to close the search grid
}
});
Sorry did not visit this thread for a while.
To determine the search criteria that user selected before pressing find use below code:
onClose:function()
{
var ofilter = $("#list").getGridParam("postData");
for (var i = 0; i < ofilter.rules.length; i++)
{
alert(ofilter.rules[i].field); //- field name
alert(ofilter.rules[i].data); //- value
alert(ofilter.rules[i].op); //- which operation performed
}
}
Related
I am creating a custom CheckBoxTableView where the selected items are displayed with a CheckBox. If the user attempts to sort the table once items are selected, it appears to mess up. I would like to prompt the user to see if they would like to continue. If so, I would like to clear the selection, if not, simply consume the event so the sorting doesn't happen.
Unfortunately - my EventFilter seems to fire after the sort was completed.
On the TableView constructor, I placed the following code:
addEventFilter(MouseEvent.MOUSE_CLICKED, event -> {
if(event.getTarget() instanceof TableColumnHeader) {
Alert a = new Alert(Alert.AlertType.CONFIRMATION);
a.setContextText("you sure?");
Optional<ButtonType> bt = a.showAndWait();
if(bt.isPresent() && bt.get() == ButtonType.OK){
//Clear selection
getSelectionModel().clearSelection();
}else {
event.consume();
}
}
});
But by the time my EventFilter fires, the table has been sorted.
Any thoughts?
Use MouseEvent.MOUSE_PRESSED
MouseEvent.MOUSE_CLICKED is fired after MouseEvent.MOUSE_RELEASED that's too late to intercept listeners and listeners :)
I have a dropdown with values-Name,MobileNumber and a input text-box related to the selected dropdown.
I want to limit the textbox entry values with only alphabet when Name is selected from the dropdown and only Numbers when MobileNumber is selected. This I am achieving by adding the below thing.
*
On(dom.byId("dropdownid"), "keypress", function(e)){
if(dom.byId("dropdownid").value=="Name"){
On(dom.byId("textboxid"), "keypress", function(e){
if(RegularExpressionAlphabetOnlyCondition == e.charCode){
Stopping the event using e.stopEvent();
}
});
}
if(dom.byId("dropdownid").value=="MobileNumber"){
On(dom.byId("textboxid"), "keypress", function(e){
if(RegularExpressionNumbersOnlyCondition == e.charCode){
Stopping the event using e.stopEvent();
}
});
}
});
*
Now on change of the dropdown value I am adding change event for dropdown and adding similar keypressevent with regularexpression condition of only numbers.
But its not working and accepting only alphabet still. It is apparently not replacing the already placed keypressevent.
How to remove the Keypress event in dojo for a textbox on change of a dropdown value?
The on Function returnes a handle
var h = On(dom.byId("textboxid"), "keypress", function(e){console.log("do Stuff"});
You can then use the handle to cancel it listener before doing a new one
if(h)h.remove();
I've created a Kendo Scheduler that binds to a remote data source. The remote datasource is actually a combination of two separate data sources. This part is working okay.
Question is... is there any way to prevent certain events from being destroyed?
I've stopped other forms of editing by checking a certain field in the event's properties and calling e.preventDefault() on the edit, moveStart and resizeStart events if it should be read-only. This works fine, but I can't prevent deletes.
Any suggestions greatly appreciated.
Just capture the remove event and process it as you have with the edit, moveStart, and reviseStart events. You should see a remove event option off the kendo scheduler. I can see it and capture it in version 2013.3.1119.340.
I think better way is to prevent user from going to remove event in the first place. Handling the remove event still has its validity as you can delete event for example by pressing "Delete" key).
In example below I'm assuming event has custom property called category and events with category equal to "Holiday" can't be deleted.
remove: function(e)
{
var event = e.event;
if (event.category === "Holiday")
{
e.preventDefault();
e.stopPropagation();
}
},
dataBound: function(e)
{
var scheduler = e.sender;
$(".k-event").each(function() {
var uid = $(this).data("uid");
var event = scheduler.occurrenceByUid(uid);
if (event.category === "Holiday")
{
// use .k-event-delete,.k-resize-handle if you want to prevent also resizing
$(this).find(".k-event-delete").hide();
}
});
},
edit: function (e) {
var event = e.event;
if (event.category === "Holiday")
{
e.container.find(".k-scheduler-delete").hide();
}
}
FYI, you can do this...
#(Html.Kendo().Scheduler<ScheduledEventViewModel>()
.Name("scheduler")
.Editable(e => e.Confirmation(false))
)
which will deactivate the default confirmation prompt for the scheduler. Then you can do your own prompt on items you want.
There is also a
.Editable(e => e.Destroy(false))
that you can do to remove the X on the event window. This particular example would remove it for all of the events, but there might be a way to remove it for specific ones.
I'm using a YUI2 DataTable.
Some of the rows of the tables have an icon button that when clicked on will popup additional details for the row.
I'm doing the following to define the panel which gets displayed with the additional information:
MyContainer.panel2 = new YAHOO.widget.Panel("popupPanel2",
{ width:"650px", visible:false, constraintoviewport:true, overflow:"auto" } );
MyContainer.panel2.render();
YAHOO.util.Event.addListener("showButton2", "click",
MyContainer.panel2.show, MyContainer.panel2, true);
So, everything works well with that. Then I added a button that when clicked on filters out some of the rows.
MyContainer.oPushButton1.onclick = function onButtonClickp(p_oEvent)
{
var filter_val = "xxx";
myDataTable.getDataSource().sendRequest(filter_val,
{success: myDataTable.onDataReturnInitializeTable},myDataTable);
}
This filters and redraws the table. But after doing that, the buttons on the remaining rows that should popup a panel no longer work.
Nothing happens when I click on the buttons.
I'm sure I've done something wrong, but I don't know what. The buttons and panels with the correct id's still seem to be available on the page.
Do I somehow have to re-enable the listener for the click event after the datatable redraw? I'm not sure where to look for trying to debug the failed listener.
I got this working by making a call to addListener again after resetting the data for the Datasource.
MyContainer.oPushButton1.onclick = function onButtonClickp(p_oEvent)
{
var filter_val = "xxx";
myDataTable.getDataSource().sendRequest(filter_val,
{success: myDataTable.onDataReturnInitializeTable},myDataTable);
YAHOO.util.Event.addListener("showButton2", "click",
MyContainer.panel2.show, MyContainer.panel2, true);
}
i would like to ask how i can intercept the ajax delete functionality of a grid using ajax binding? specifically, up to the point wherein, after i click on delete, as the confirm prompt pops up, i would like to do something based on the user's choice,
basically, if OK, do this, if CANCEL do that..
You need to use the OnRowDataBound and attach a click handler to the delete button. Then you can display custom confirmation and decide what to do. If you want' to prevent the grid deletion code - call e.stopPropagation(). Here is a quick sample:
<%: Html.Telerik().Grid(Model)
// Prevent the grid from displaying the default delete confirmation
.Editable(editing => editing.DisplayDeleteConfirmation(false))
// Subscribe to the OnRowDataBound event
.ClientEvents(e => e.OnRowDataBound("onRowDataBound"))
%>
<script>
function onRowDataBound(e) {
$(e.row) // get the current table row (TR) as a jQuery object
.find(".t-grid-delete") // find the delete button in that row
.click(function(e) { // handle its "click" event
if (confirm("Do you want to delete this record?")) {
// User clicked "OK"
} else {
// User clicked "Cancel"
e.stopPropagation(); // prevent the grid deletion code from executing.
}
});
}
</script>
The demo page seems to contain an example of what you are looking for.