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
How do i hide custom form when user clicks outside of it?
05/04/2012
18:08
Avatar
nelsonm
Michigan, USA
Member
Members
Forum Posts: 106
Member Since:
20/08/2011
sp_UserOfflineSmall Offline

hi

i built a custom jquery dialog form similar to the example in the jqgrid demos page "custom buttons and forms".

I would like the form to disappear when the user clicks outside of the form dialog box just like the standard jqgrid forms do.

How can i do this?

05/04/2012
18:17
Avatar
tony
Sofia, Bulgaria
Moderator
Members

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

Hello,

It depends which library you use to create the dialog. If this is the jQuery UI dialog then maybe you will need to look at thier documentation and forums.

Regards

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.

05/04/2012
19:17
Avatar
nelsonm
Michigan, USA
Member
Members
Forum Posts: 106
Member Since:
20/08/2011
sp_UserOfflineSmall Offline

Hello Tony,

I don't expect you to respond to this post since it is not DIRECTLY related to jqGRID.

In any case, i don't think jqGRID has a library or method for creating stylized custom forms.  Your demos page example does not use any jqGRID methods for creating the sample custom form other than HTML.

However, i did come up with a solution for hiding my custom "workorder-window" form dialog when the user clicks outside the form dialog.

// open the form dialog.

$('#workorder-button').button().click(function(event){$('#workorder-window').data('WOID','19').dialog('open'); $('#tab2-grid').jqGrid('GridToForm',$.data('WOID'),'#workorder-form'); event.stopPropagation();});

// stop propagation (do nothing) when i click in the form dialog.

$('#workorder-window').click(function(event){event.stopPropagation();});

// close the form dialog when the user clicks outside the dialog box.

$('html').click(function(event){$('#workorder-window').dialog('close');});

It works everywhere except when i click on a jquery tab widget button.

05/07/2012
09:55
Avatar
imdad
New Member
Members
Forum Posts: 1
Member Since:
05/07/2012
sp_UserOfflineSmall Offline

Hi nelsonm,

I am also searching for a customized layout editform for a jqgrid. In my case edit form can also contain more jqGrid. I will be thankful if you share some demo example like you did in your custom "workorder-window" form dialog. My email id is imdad.sarwar@gmail.com

nelsonm said:

Hello Tony,

I don't expect you to respond to this post since it is not DIRECTLY related to jqGRID.

In any case, i don't think jqGRID has a library or method for creating stylized custom forms.  Your demos page example does not use any jqGRID methods for creating the sample custom form other than HTML.

However, i did come up with a solution for hiding my custom "workorder-window" form dialog when the user clicks outside the form dialog.

// open the form dialog.

$('#workorder-button').button().click(function(event){$('#workorder-window').data('WOID','19').dialog('open'); $('#tab2-grid').jqGrid('GridToForm',$.data('WOID'),'#workorder-form'); event.stopPropagation();});

// stop propagation (do nothing) when i click in the form dialog.

$('#workorder-window').click(function(event){event.stopPropagation();});

// close the form dialog when the user clicks outside the dialog box.

$('html').click(function(event){$('#workorder-window').dialog('close');});

It works everywhere except when i click on a jquery tab widget button.


05/07/2012
18:44
Avatar
nelsonm
Michigan, USA
Member
Members
Forum Posts: 106
Member Since:
20/08/2011
sp_UserOfflineSmall Offline

Unfortunetly, i ended up trashing my custom form.  Creating a custom stylized form in jqgrid requires a lot of dom modification via jquery.  I concluded that it's not worth it.

I ended up creating a new custom form that does not interact with jqgrid at all.

If jqgrid populated and manipulated the grid associatively rather than numerically, creating a custom stylized form would have been easier.

Even their commercial php version of the jqgrid form generator still creates a linear row/column form.  You can't group objects and surround them in a bordered box or move the group around to organize the form in any logical way.

You can't do this:

Image Enlarger

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
55 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