473,721 Members | 2,254 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

jQuery Modal dialog form

15 New Member
I'm new to developing in jQuery, so I'm probably doing this wrong. I'm loading a form into a modal dialog box and I'm trying to assign a click event to the button in the form, but I can't seem to get anything to happen. Below is the code. Thanks in advance.

jQuery:
Expand|Select|Wrap|Line Numbers
  1. jQuery(document).ready(function()
  2. {
  3.     jQuery("a[@id*=form]").click(function()
  4.     {
  5.         jQuery("#dialog").dialog({
  6.             modal: true,
  7.             autoOpen: false,
  8.             width: 600,
  9.             dialogClass: "flora",
  10.             overlay: {opacity: 0.5, background: "black"}
  11.         });
  12.         jQuery("#dialog").load(jQuery(this).attr("href") + " form[@id*=order] fieldset",setFormClick());
  13.         jQuery("#dialog").dialog("open");
  14.         return false;
  15.     });
  16.  
  17.     function setFormClick()
  18.     {
  19.         jQuery('#dialog input[@id*=update]').click(function()
  20.         {
  21.             alert("It works");
  22.         });
  23.     }
  24. }
  25.  
.ASPX Main Page
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="C#" AutoEventWireUp=true CodeFile="Order_02_ServiceAdmin.aspx.cs" Inherits="_Default" %>
  2. <?xml version="1.0" encoding="iso-8859-1"?>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml11-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5.     <head>
  6.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  7.         <link href="/custom/applications/appStyles.css" rel="stylesheet" type="text/css" media="screen" />
  8.         <link rel="stylesheet" href="/custom/applications/jquery.ui-1.5/themes/flora/flora.dialog.css" type="text/css" media="screen" />
  9.         <script type="text/javascript" src="/custom/applications/jquery.ui-1.5/jquery-1.2.6.js"></script>
  10.         <script type="text/javascript" src="/custom/applications/jquery.ui-1.5/ui/ui.core.js"></script>
  11.         <script type="text/javascript" src="/custom/applications/jquery.ui-1.5/ui/ui.dialog.js"></script>
  12.         <script type="text/javascript" src="javascript/Order_02_functions.js"></script>
  13.     </head>
  14.     <body>
  15.         <form id="Order_02" runat="server">
  16.                 <div id="dialog"></div><!--Form inserted here-->
  17.                 <!--Irrelevant code here-->
  18.         <div style="float: left; width: 40%; height: 100%;">
  19.             <fieldset style="overflow: auto">
  20.                 <legend>Selected Services</legend>
  21.                 <asp:table ID="servicesSelected" runat="server" Caption="No Services Selected" EnableViewState="false">
  22.                     <asp:tableheaderrow CssClass="eth">
  23.                         <asp:tableheadercell>
  24.                             Service (Click to input details)
  25.                         </asp:tableheadercell>
  26.                         <asp:tableheadercell>
  27.                         </asp:tableheadercell>
  28.                         <asp:tableheadercell>
  29.                             Status
  30.                         </asp:tableheadercell>
  31.                         <asp:tableheadercell>
  32.                             Notes
  33.                         </asp:tableheadercell>
  34.                     </asp:tableheaderrow>
  35.                 </asp:table>    
  36.             </fieldset>
  37.         </div>
  38.                 <!--Irrelevant code here-->
  39.          </form>
  40.     </body>
  41. </html>
  42.  
.cs code for main page builds table above adding links that jQuery attaches click events to. The links look something like this:
<a id="form999999 " href="SubForms/Order_02_Form_0 1.aspx?lineNumb er=999999">Serv ice Description</a>

.ASPX Form code
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="C#" AutoEventWireUp=true CodeFile="Order_02b_Form_01.aspx.cs" Inherits="_Default" %>
  2. <?xml version="1.0" encoding="iso-8859-1"?>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml11-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5.     <head>
  6.         <link href="/custom/applications/appStyles.css" rel="stylesheet" type="text/css" media="screen" />
  7.     </head>
  8.     <body>
  9.         <form id="order01" runat="server">
  10.             <fieldset id="01" class="generalFieldsetStyle">
  11.                 <legend></legend>
  12.                 <p>
  13.                         <label for="t01_COUNTY"><span class="importantText" >*</span>County:&nbsp;</label>
  14.                         <asp:textbox ID="t01_COUNTY" runat="server" MaxLength="30"/><span id="reqCounty" style="color: red; visibility: hidden">Please enter the name of the county</span><br/>
  15.                          <label for="t01_STATE_PROVINCE">
  16.                              <span class="importantText">*</span>State:&nbsp;
  17.                          </label>
  18.                         <asp:dropdownlist id="t01_STATE_PROVINCE" runat="server">
  19.                             <asp:listitem value="" Text=""></asp:listitem>
  20.                             <asp:listitem value="NY" Text="NY"></asp:listitem>
  21.                         </asp:dropdownlist>
  22.                         <span id="reqState" style="color: red; visibility: hidden">Please select a state</span><br/>
  23.                         <input id="update01" name="update01" type="button" value="Update" />
  24.                 </p>
  25.             </fieldset>
  26.        </form>
  27.     </body>
  28. </html>
  29.  
.cs code mainly just generates the options for the dropdown list.
Jun 17 '08 #1
1 49877
mikeh3275
15 New Member
I updated the code so the load call matches the full number of parameters for the method. As such, the links no longer carry a get value. Below is the updated jQuery code:

Expand|Select|Wrap|Line Numbers
  1. jQuery(document).ready(function()
  2. {
  3.     jQuery("a[@id*=form]").click(function()
  4.     {
  5.         var lNum = $(this).attr("id");
  6.         lNum = lNum.substring(4, lNum.length);
  7.         jQuery("#dialog").dialog({
  8.             modal: true,
  9.             autoOpen: false,
  10.             width: 600,
  11.             dialogClass: "flora",
  12.             overlay: {opacity: 0.5, background: "black"}
  13.         });
  14.         jQuery("#dialog").load(jQuery(this).attr("href") + " form[@id*=order] fieldset", {lineNumber: lNum}, setFormClick());
  15.         jQuery("#dialog").dialog("open");
  16.         return false;
  17.     });
  18.  
  19.     function setFormClick()
  20.     {
  21.         jQuery('#dialog input[@id*=update]').click(function()
  22.         {
  23.  
  24.             alert("It works");
  25.         });
  26.     }
  27. });
  28.  
  29.  
Jun 17 '08 #2

Sign in to post your reply or Sign up for a free account.

Similar topics

2
12248
by: martin de vroom | last post by:
Hi, I have a web page that opens a modal dialog (client side) in the following manner onclick="window.showModalDialog('/dialog.asp',null,'dialogHeight: 200px; dialogWidth: 400px; dialogTop: 300px; dialogLeft: 150px; edge: Sunken; center: Yes; help: No; resizable: No; status: No;');"> and the page loads in the modal dialog no problem.
2
3881
by: Matt | last post by:
I want to know how to submit the form data to a modal dialog window? The following is page1.asp, and when the user clicks submit button, it will post the form data to page2.asp by opening a new window. But I want modal dialog window, any ideas?? <form action="page2.asp" method="post" target="_blank"> <input type="text" name="username"> <input type="submit" name="submit"> </form>
1
2809
by: VM | last post by:
Is it possible to display a form as a modal dialog box where it's is not a top-level form? If I include it as a top-level form, I won't be able to access all the MDI children through it (by using this.MdiParent.MdiChildren from within the form). Thanks.
10
2753
by: Guadala Harry | last post by:
I have a modal dialog that currently does all of the following except item 4. 1. lets users select a graphic from a list of thumbnails (and when selected, displays the full-size image in a preview DIV) 2. when users close the dialog, the application receives the URL to the selected graphic. 3. the modal dialog lets the users upload a new graphic if the dialog does not present them with one they are already happy with. 4. upon uploading...
4
9494
by: mpreston | last post by:
I'm following the example from the MSDN library on how to create modal dialog boxes in C#, but something isn't working properly. If I create a modal dialog box and show it using ShowDialog(), the main form behind the dialog box is still enabled and can operate normally. If I use MessageBox.Show() to show a message box, the main form is disabled until the dialog box terminates. How can I make a custom dialog box do this?
0
1370
by: sskala | last post by:
Hi, Hope you might have seen the new version of yahoo mail. When you click an attachment in your mail, it pops up a window which shows the progress of SCAN. The user won't be able to close it or access yahoo mail until this process is complete and the "Done" button is enabled. This is like a modal dialog without controlbox (no minimize, maximize and close buttons). I got a similar requirement in my project. When the user clicks the...
1
3865
by: dan.c.roth | last post by:
oForm.Close() vs this.Close() in a modal dialog. oFrom.Close() calls Form.Dispose() but this.Close() ,say in the click event of the Form, does not. I can think of the reason for this but is this documented and if so can someone give me the reference. And is this true for .net 1 and 2. Thanks
11
2371
by: VK | last post by:
In the continuation of the discussion at "Making Site Opaque -- This Strategy Feasible?" and my comment at http://groups.google.com/group/comp.lang.javascript/msg/b515a4408680e8e2 I have realized that despite suggestions to use DHTML-based modal dialogs are very common? there is not a single fully functional reliable copyright-free cross-browser alternative to say MsgBox (VBScript) or showModalDialog (IE). This way such suggestions up to...
3
4944
pradeepjain
by: pradeepjain | last post by:
hii.. i use cope like this <td><a href='/login.php' id="view-user" >Pradeep</a></td> and defauly jquery dialog code <script type="text/javascript"> $(function() { $("#dialog").dialog("destroy"); $("#dialog-form").dialog({
0
9367
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9064
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8007
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6669
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5981
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4484
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
3189
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
2576
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2130
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.