jQuery Grid Plugin - jqGridForum

Topic RSS

Custom Input: Form Editing el.val() always undefined

17/11/2009
14:43

Basdub

Member

Members

Forum Posts: 24

Member Since:
19/05/2009

Offline

Might be related to Inline Edit: Custom Input

In the documentation (and don't take this the wrong way), it says that custom_element is used to create the input element for the form and custom_value is used to get the value to be sent to the server.

The question is: What is custom_value doing in fillData function?????????? I'm bugging you don't take it the wrong way!!!

What i've noticed so far:

When i click on the pencil icon, the form is displayed correctly without any problem.
When i click the Submit button, the custom_value is not called and therefore the value for that field is not sent to the server
When i reopen the edit form for the same or a different row, custom_value is called from the fillData function according to firebug... and the source code 🙂

To solve this (this is my opinion only):

filldata should "always" use $.fn.***.unformat function to get the value from the grid
the custom input should be handled with 3 functions instead of 2
- custom_element: create the lement
- custom_value: format the value for the input field defined by custom_element
- custom_postvalue: return the unformatted or else value from the custom_element that will be sent to the server.

Regards!!

17/11/2009
16:10

markw65

Member

Members

Forum Posts: 179

Member Since:
30/07/2009

Offline

I'll second this one.

fillData should use unformat to get the data, and the custom element should take /that/ string as its input when filling in the value on the edit form.

Mark

17/11/2009
16:24

Basdub

Member

Members

Forum Posts: 24

Member Since:
19/05/2009

Offline

Thanks Mark,

Concerning the data that is not posted, I think i've found the source of the problem:

In file grid.formedit.js around line 543. you will find the following:

if($(this).hasClass("customelement"))

In that situation, $(this) is in fact the container of the input element => <span class="FormElement"><input...

Therefore it will never have the class customElement.

Solution:

Change $(this) to $(this).children("input")[0]

Well, there might be a better way to get the the first child of the span element. I will be please to learn that!!!!

Regards,

17/11/2009
16:34

Basdub

Member

Members

Forum Posts: 24

Member Since:
19/05/2009

Offline

Mark, the only reason that i want to add the *new* custom_value is in this situation (for example).

I have a field stored in numeric in my database that represent a duration in seconds. In the grid, I use the custom format and unformat to convert this value into “hh:mm:ss”.

Right now, when i create the form (the first time), i get the unformatted value for example “120″ that i transform again to “00:02:00″ (2 minutes) for my input field value. Then, after i created my input control, i can associate a time picker using, for example, $(<input>).timepicker().

If filldata doesn't recreate the input control, then the next time i open the edit form, I assume that i will see “120″.

Now with the new functions,

custom_value*: change “120″ to “00:02:00″ and if custom_value doesn't exist, it would simply display the unformatted value taken from $.fn.***.unformat

custom_postvalue: change back “00:02:01″ to “121″ to send back to the server.

Regards

17/11/2009
16:46

Basdub

Member

Members

Forum Posts: 24

Member Since:
19/05/2009

Offline

To make things less confusing, lets redefined the 3 functions again:

custom_element: create the input element;

custom_format: format the data for the custom_element value

custom_value: unformat or else the custom_element value to be sent to the server

17/11/2009
18:16

markw65

Member

Members

Forum Posts: 179

Member Since:
30/07/2009

Offline

So it looks like the custom element has changed since the documentation was written:

custom_element.custom_value(jQuery-element, "get") returns the value of the custom element that should be posted to the server.

And it appears that the corresponding "set" is supposed to set the value in the form... but unless Im very confused its completely broken...

At line 766 of grid.formedit.js we have:

var dummy = cm[i].editoptions.custom_value($(".customelement",this),'set');

Problem is that "this" is actually the corresponding "td" cell - which probably doesnt /have/ a child with class "customelement".Even if it did, we wouldnt know which custom element we're supposed to be setting the value of (or, on the other hand, if "this" were the span containing the custom element, we wouldnt know what value to set it to!).

I think its supposed to be

var dummy = cm[i].editoptions.custom_value($("#"+nm,"#"+fmid),'set',tmp);

Where tmp /is/ the unformatted value of the cell.

So, in other words, apart from the naming convention (and the bug!), everything is supposed to work the way we both want anyway...

Mark

17/11/2009
22:09

Basdub

Member

Members

Forum Posts: 24

Member Since:
19/05/2009

Offline

Sounds great when you say:

“

So, in other words, apart from the naming convention (and the bug!), everything is supposed to work the way we both want anyway…

“

Unfortunately, it is late and I'm not sure I understand your explanation on how custom_element and custom_value are called and used.

I'll read again tomorrow

17/11/2009
23:26

markw65

Member

Members

Forum Posts: 179

Member Since:
30/07/2009

Offline

Basically, the custom_value function has two purposes, one to get the value from the form, and post it to the server, and the other to put the value into the form.

Rather than two functions, its a single function, and the second parameter is either "set" or "get" to control which operation it performs.

But basically "get" is your custom_value, and "set" is your custom_format.

The problem is that the call to "set" from fillData is broken, and cant possibly work (again, assuming Im not just confused). So right now, to use a custom element you have to use { recreateForm:true }.

Mark

18/11/2009
07:08

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Mark, Basdub,

Thanks. I have made the needed fixes. Appart from this there was another bug in case when the value is empty -

I compare it like this

tmp[nm] = cm.editoptions.custom_value($(".customelement",this));

if(!tmp[nm]) ....

which is wrong if the value is 0 or empty.

Also I will update the documentation in case of formediting

The changes are in GitHub.

Thanks again

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.