Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_TopicIcon
Validating a cell on change
19/06/2008
18:22
Avatar
Reg
Calgary, Canada
Member
Members
Forum Posts: 92
Member Since:
06/06/2008
sp_UserOfflineSmall Offline

Hi Tony,

In some other thread you described how to save a individual cell; I am trying to adapt that to my purposes and not having much success with it.

I am building an accounting application; I am using inline editing to provide for entering payments against invoices. When a row is selected, the operator enters an Invoice number, and when the focus leaves that cell (with tab, not enter), I want to use ajax to retrieve data about that invoice (date issued, to whom issued, original amount, total outstanding, etc.).

The name of the grid is tblcontents_details; the field is invoice

So I have the following in the definition of the grid (all on one line, it wraps here):

      onSelectRow: function(id){
        $('#tblcontents_details').editRow(id,true,jqChecktblcontents_details); },

My function is this:

function jqChecktblcontents_details(id)
  {
        $('#tblcontents_details_invoice').change ($.ajax({url: "wc.dll?PSProcess~GetInvData&sk=2EB10HG8P3176&sh=7", type: 'GET', data: {invoice: '15' }, datatype: 'xml', success: alert("Data Loaded") } ));
  };

My problem is that when I select the row to edit it, this function fires immediately (presumably because the value of the field changes from null to blank (or something like that) but never again. I can cope with it firing once at the start when I don't need it to, but what I really want is to have it fire when I leave the field after making a change

I have also tried to set the change function before editing like the following:

      onSelectRow: function(id){
        $('#tblcontents_details_invoice').change ($.ajax({url: "wc.dll?PSProcess~GetInvData&sk=2EB10HG8P3176&sh=17", type: 'GET', data: {invoice: '15' }, datatype: 'xml', success: alert("Data Loaded") } ));
        $('#tblcontents_details').editRow(id,true); },

The same thing happens; it fires as soon as I select the row, but not when the contents change.

Is there any way to maket his work? I hope I am missing something really simple.

Thanks

Reg

20/06/2008
03:41
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Reg,

When you use a inlineedit and when the row is in edit mode the plugin creates anuquie id for that cell which is a combibantion of rowid+_+ the name of the cell. I think that this a simple. Suppose the name of cell is mycell

var jqChecktblcontents_details = function(id){

$('#'+id+"_"+"mycell","#mygridid").change(function() {

// do something here

});

}

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

20/06/2008
10:58
Avatar
Reg
Calgary, Canada
Member
Members
Forum Posts: 92
Member Since:
06/06/2008
sp_UserOfflineSmall Offline

Hello Tony,

Yes, that was in your original post and somewhere along the way I forgot it; sorry to bother you with that bit of trivia.

I now have this function working ... almost. I made a  change to use .bind, as shown here:

      onSelectRow: function(id){
       $('#'+id+'_'+'invoice').bind('change',jqOnChangeinvoice);
       $('#'+id+'_'+'amount').bind('change',jqOnChangeamount);
        $('#tblcontents_details').editRow(id,true); },

This now fires only when the field contents change; when it does fire an object is passed to the listener (e.g., jqOnChangeInvoice -- shown here, still very much in test mode):

function jqOnChangeinvoice(id)
  {
    alert('id =' + id);
    $.ajax({url: "wc.dll?PSProcess~GetInvData&sk=2EC0GGNI01900&sh=75", type: 'GET', data: {invoice: '15' }, datatype: 'xml', success: alert("Data Loaded" + data) } );
  };

When this fires, the alert shows "id = object Object"

Is this what you would expect?

If this object the cell or the row?

How can I get or set values from/to other cells on the same row in this function call?

Thanks

Reg

22/06/2008
02:54
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Reg,

The problem in your last post is that you do not pass a parameter to bind

event. For more information refer to jQuery docs on how to set parameter

to bind function. I think there is a more simple solution to you problem.

$("mygrid").jqGrid({

...

onSelectRow: function(id){
  $('#tblcontents_details').editRow(id,true,jqChecktblcontents_details);

},

...

});

var jqChecktblcontents_details = function(id){

$('#'+id+”_”+”mycell”,”#mygrid”).change(function() {

// do something here

});

}

I think that this should work

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

23/06/2008
20:40
Avatar
Reg
Calgary, Canada
Member
Members
Forum Posts: 92
Member Since:
06/06/2008
sp_UserOfflineSmall Offline

Thank you Tony,

With your tip I have managed to get this going -- I guess the hard way, because I am using a getJSON call that seems to do all that I want it to. I'm not ignoring your advice, I tried to make it work using the .change approach, but it kept firing when I created the new row and I wasn't able to see far enough ahead to be confident I could do different things for different fields. Not only am I learning jqGrid, but I really know almost nothing about jQuery and even javascript -- that's why your package is such a life-saver. I am learning, however.

Anyway, that part works and I greatly appreciate your help and patience on this. I am now getting json data back and am starting to work with that.

My problem is that I can insert this data into some of the fields on the selected row but not others -- my code (when the call is successful) includes the following:

        $('#' + id + '_invoiced').html(json.amount);
        $('#' + id + '_outstanding').html(json.outstanding);
        $('#' + id + '_project').val(json.project);
        $('#' + id + '_client').val(json.client);

Project and Client are modified correctly but Invoiced and Outstanding are not. One difference is that Project and Client are editable fields, and Invoiced and Outstanding are not. I tried using .val() on those two as well, but that also did not work. Are we able to modify uneditable fields like this -- or what am I doing wrong? Or is it that they are modified correctly but just not displaying?

Thanks

Reg

24/06/2008
02:19
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Reg,

For noneditable fields you should use a setRowData method

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
44 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information