jQuery Grid Plugin - jqGridForum

19/05/2010
16:13

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

1

Hello. First off let me state that I'm really like jqGrid. Very nice features and reasonably good docs on the Wiki.

I'm building an application that uses jqGrid and I've written my own custom form for editing data. Everything is working fine but now I'm to the point where I need to update the grid once the data has been saved.

I'd like to only update the SINGLE row that gets added, or edited, but as I've done my own custom dialog (it is a jQuery Dialog, btw), I am not sure what functions I need to call to update the grid with the modified data. Is there any way to achieve this or do I have to just trigger the entire grid to reload?

Thanks in advance.

19/05/2010
16:50

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

2

I'm going to reply to my own post here. I noticed a function called "setRowData" that I think can be used for this so I'll be exploring that avenue. If anyone has any useful tips about using this method, please post them :).

Thanks again.

19/05/2010
19:58

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

3

So I made a few changes to my code and started using 'FormToGrid.' It seemed to work well, with one oddity. When I edit an item, and then call 'FormToGrid' everything works properly. However, when I edit an item the 2nd time, one of the columns gets cleared completely before I even save the data (i.e. the form comes up but the element in the grid gets cleared as soon as the form is displayed). I'm wondering if this is a bug in the code related to TreeGrid style grids because the column that gets cleared is the column where the tree icon is displayed (the little arrow/circle). I was going through setRowData and saw this piece of code:

vl = t.formatter( rowid, data[nm], i, data, 'edit');
title = this.title ? {"title":$.jgrid.stripHtml(vl)} : {};
if(t.p.treeGrid===true && nm == t.p.ExpandColumn) {
$("td:eq("+i+") > span:first",ind).html(vl).attr(title);
} else {
$("td:eq("+i+")",ind).html(vl).attr(title);
}

and I am wondering if this might have something to do with it. Seeing as I've only been using jqGrid for one day, I'm a noob here so this may just be grasping at straws.

19/05/2010
20:29

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

4

Ok, one last post... maybe :).

This is what the item in the tree looks like before I edit it:

<span>Another Title</span>

I edit it and change the words "Another Title" to "Changed Title" and now the same element looks like:

<span title="Changed Title">Another Title</span>

When I edit it again, even BEFORE I actually perform the edit, it gets changed to:

<span title="Changed Title" style="visibility: hidden;">Another Title</span>

Am I missing something here?

19/05/2010
20:34

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

5

Found it . Was my fault. I use the ClueTip jquery Add on and was hiding all spans with a title prior to editing the form. This was causing the span that has the title in the jqGrid to be hidden (but only the 2nd time because there's no title when it's first set). Anyhow, problem soved .

I guess sometimes it just helps to talk through a problem by yourself to diagnose the issues!

Back to the grindstone!

I guess my only other question was related to why the Title of the span is changed to the new value, but the contents of the span retain its original value (or so this is how it seems to react). After I change the value of the cell, the displayed value is always correct. However, when I hover OVER the cell, I see its original value in the hover tip. I'll continue looking at my code to see if this is, once again, a bug in my code. I verified that the non-tree demo works as expected, so I'm guessing it's my code.

25/05/2010
16:48

kweles

Brazil

Member

Members

Forum Posts: 9

Member Since:
13/05/2010

Offline

6

Hi squid.

I need create my own form like too, for adding and saving data and i need call with dialog.

How do you make this?

Could you help me?

Thanks!

25/05/2010
17:04

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

7

Help you what, create a dialog?

25/05/2010
19:31

kweles

Brazil

Member

Members

Forum Posts: 9

Member Since:
13/05/2010

Offline

8

i need to create a form like this below:

And now, i want call it with dialog! like jqgrid makes with edit and view data in dialog!

Bu i don´t know make this!

25/05/2010
19:41

squid

Member

Members

Forum Posts: 36

Member Since:
19/05/2010

Offline

9

And do you want jqGrid to manage it all for you or are you trying to do the complete form, validation, etc. by yourself?

25/05/2010
20:39

kweles

Brazil

Member

Members

Forum Posts: 9

Member Since:
13/05/2010

Offline

10

Yes i realize the complete validation.

Friend, i found the example, that solve my needed, Thank you for his help:

My really needed was call a form with jquery dialog, in this way, the code below soved my problem!

Javascricpt:

function formOpen() {

$("#dialog").dialog();

}

HTML

No HTML, basta colocar uma div e o q estiver dentro dela vai para a dialog:

<div>

<b>Dados do Cliente:</b>

</div>

<br>

<s:div>

<tr>

<td width="74"> Sobrenome </td>

<td width="360"> <input name="sobrenome" type="text" id="sobrenome" style="width:60%" /> Apelido <input name="apelido" type="text" id="apelido" style="width:23%" /> </td>

</tr>

<tr>

<td> Personalizado</td>

<td> Email</td>

</tr>

<tr>

<td> Email Alt.</td>

</tr>

</table>

</s:div>

<br>

</div>

<!—Chamada-->

Invice No:
Invice Date:
Client
Amount
Tax
Total
Note