how to use onCellSelect method in JqGrid? - jqgrid

onCellSelect : function(rowid, iCol, cellcontent) {
$('#caseHistoryGrid').dialog('close');
$('#Case_Id').val(jQuery("#case").jqGrid('getCell', rowid,'caseId'));
$('#visitId').val(jQuery("#case").jqGrid('getCell', rowid,'visitId'));
alert($('#visitId').val()
);
}
when i click any cell. i get First VisitID only.
what s my Fault.
Please help.
Thanks in Advance

in This Code Not Problem But i get data from database using Ajax in tese data is formate
id
.....
give id is Not Unique So it gives the same celll

Related

OnCurrentIndexChange handler triggering before I select a row on the table in Wix

I'm trying to get the row data from a table which is connected to a dataset. So as per the this article, since, I need the whole data of the selected row, I'm using OnCurrentIndexChange event handler to get the selected row's data from the dataset. But for some strange reason, the first row item will always be triggered on the load of the table/page.
Basically, the first row data will be selected on the load of the page/table. Is this a bug or am I doing something wrong?
Any help will be greatly appreciated.
Thanks,
Jilu
Though I couldn't get to work with OnCurrentIndexChange handler. But I found a work around by which I could fix this bug/issue for my application.
Solution:
Instead of using OnCurrentIndexChange handler of the dataset, I used OnSelectRow event handler to get the row index of the table and used that index to get the whole row data from the dataset. More on this get method, you can find here.
Below is the code for your reference:
export function tblCustomerList_rowSelect(event) {
$w("#dsCustomer").getItems(event.rowIndex, 1)
.then(result => {
let selectedRow = result.items[0];
console.log(selectedRow);
if (selectedRow !== null) {
let returnObj = {
"name": selectedRow.name,
"id": selectedRow._id
}
wixWindow.lightbox.close(returnObj);
}
})
}
Hope this will be helpful for people who are stuck with such kind of issue in wix.
Thanks,
Jilu

using imdbapi.com to popluate textboxes with jquery/ajax

I'm trying to get the movie details from IMDB according to the title of a movie, i am using imdbapi.com's API to do this.
Now it seems to be returning the JSON just fine, however i can't seem to populate the textbox and can not for the life of me work out why its not populating.
Can someone please check this out and see if you can shed some light?
I have tried :
function getData(title) {
$.getJSON('http://www.imdbapi.com/?t=' + title,
function (data) {
$('#TextBox2').text(data.Plot);
}
);
}
$('#TextBox2').val(data.Plot);

Cakephp Ajax Button

I have a delete button. which on click it should visit a url like /delete/{id} and once the response from that url is true. i want to delete the comment box like in facebook.
I wont add any extra than Leo's comment, but I will explain with some code. Presume that you are using jQuery...
$(document).ready(function(){
$('tr a.delete').live('click', function(e){
e.preventDefault();
var link = $(this);
$.get($(this).attr('href'), null, function(response){
if(response == 'ok'){ //you should invent how to get 'ok' or other string identifying that the deletion is successful.
link.parents('tr').remove();
} else {
alert('There is a problem while deleting this element');
}
});
})
});
if you put this code on your project it will handle all links which had .delete class and are in a table row.
There are two things which you should do:
You need to pass some string in
order to detect if the operation is
successful or not. In my example I
would print "ok" on success
deletion.
If your table has pagination, it wont
rebuild the table, while it just
will remove the row from the table.
and if you have let's say 5 rows per
page and you delete all of them the
page will remain empty while there
will be other records in the table.
That's why instead of removing the
tr I would reload the whole page.
In that case the code for successful deletion will look like this:
if(response == 'ok'){
$('#content').load(window.location);
}
The script is not optimised, but it will give you the ideas how to achieve your ideas.
HTH
So write an onClick event handler in your view, a php delete method on the appropriate controller called by the event handler and a javascript action to perform when the ajax call returns success.

making jQuery plug-in autoNumeric format fields by time page loads

I've been messing around with autoNumeric, a plug-in for jQuery that formats currency fields.
I'd like to wire the plug-in so that all currency fields are formatted by the time the user sees the page, e.g., on load.
Currently, the default that I can't seem to get around is that fields are formatted upon blur, key-up or other action in the fields themselves.
I've been experimenting with the plug-in code and it looks like it will take this relative newcomer some time to resolve this, if at all.
Anybody on this?
Lille
Triggering 'focusout' event formats the field. Triggering 'change' does not work in the most recent version (1.7.4).
$('input.money').autoNumeric({aNeg: '-'}).trigger('focusout');
autoNumeric does all formatting after 'onchange' event fires. So all that you need is to programmatically fire this event. Like this:
$('input.money').autoNumeric({aNeg: '-'}).trigger('change');
Hope this helps!
I just ran into this problem myself. I had to make it more general, but this worked for me:
$('input.auto-numeric').ready(function(){
var format_options = {
aSign: '$'
};
$('input.auto-numeric').each(function(){
$(this).autoNumeric(format_options);
if($(this).attr('id')){
$(this).val($.fn.autoNumeric.Format($(this).attr('id'), $(this).val(), format_options));
}
});
});
This should work.
jQuery(function($) {
$('input.auto').ready(function(){
$('input.auto').autoNumeric();
var inputID = uniqueID; // use the jQuery.get() function to retrieve data
var formatValue = '1234.00'; // use the jQuery.get() function to retrieve data
if(jQuery().autoNumeric){
$('#id').val($.fn.autoNumeric.Format(inputID, formatValue));
}
else{
alert('plugin not available');
}
});
});
Bob
This is what I eventually did:
$(document).ready(function(){
$('input.auto').autoNumeric();
$('input.auto').each(function(){
var element = this
if(element.value !=""){
$('#'+element.id).val($.fn.autoNumeric.Format(element.id, element.value));
}
}
);
});
Another way of forcing formatting is using 'update' like
$(".input-numeric").autoNumeric('update');
In the current version 2.* and onward, this is done by default thanks to the formatOnPageLoad option that is set to true.
It's that simple ;)

Using SortableRows and know when rows have been moved

I want to take advantage of the sortableRows property of the jqGrid. How do I detect when a row has been moved. I have studied the documentation and looked for examples but haven't found much. I do believe it is something like
jQuery("#grid").sortableRows({connectWith:'#gird',
ondrop: function(){ alert("row moved") }});
but that does not work. I can move the rows, but don't seemed to have trapped the event. Is there something wrong with my syntax or my approach in general.
Basically, I need to know that the rows have been rearranged so I can be sure they get saved with their new order.
Thanks
jqGrid uses the ui-sortable plugin to sort rows: http://jqueryui.com/demos/sortable/.
In
jQuery("#grid").sortableRows( options )
"options" is the passed to the sortable plugin.
options = { update : function(e,ui){} }
is what you want.
Attach the sortstop event handler to your grid:
jQuery("#grid").bind('sortstop', function(event, ui) { alert("row moved") });
I did a quick test and that worked for me.
jQuery('#'+grid_id).jqGrid('sortableRows', {
update: function (event, ui) {
var newOrder = $('#'+grid_id).jqGrid("getDataIDs");
//do whatever you want with new roworder
//please keep in mind this will give only page visible rows
}
});

Resources