By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,719 Members | 1,046 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,719 IT Pros & Developers. It's quick & easy.

jquery modal dialog not working

P: 4
Hello:

I have tried to implement a jquery modal dialog within an existing form. In my implementation I have had to eliminate the table and modified for use in our form. I have placed a query on the jquery ui forum but no one has answered.

I am having many issues with the form probably because I am not implementing it correctly. I have read the Nemikor blog and other posts but they have not helped with these issues. First, it appears that by using absolute urls to the jquery ui javascript and style sheets is giving me a 403 forbidden error. Is there a CDN version of these that I can use that will help this form work? I have downloaded the scripts locally but the modal dialog does not work when I do this.

Second, modifying the javascript creates formatting issues. Here is the code I am using:
Expand|Select|Wrap|Line Numbers
  1. f ( bValid ) {
  2.                         $( "#users" ).append(
  3.                             "<br style=\"width:100%;\">" + address.val() + "<br>" + "<br>" +
  4.  
  5.                             "<br>" + city.val() + "</br>" + "<br>" +
  6.  
  7.                             "<br>" + state.val() + "</br>" + "<br>" +
  8.  
  9.                         "<br>" + postalcode.val() + "</br>" + "<br>" +
  10.  
  11.                         "<br>" + country.val() + "</br>" + "<br>" +
  12.  
  13.                          "<br>" + companyphone.val() + "</br>" + "<br>" +
  14.  
  15.                          "<br>" + companyfax.val() + "</br>" +
  16.                          "<br>"); 
  17.  
  18.                         $( this ).dialog( "close" );
  19. ...
  20.  
Here is the url to the form:

http://inetwebdesign.com/PartnerPortal/update-my-company-information8.html

Because of all these issues, I am thinking of using an old school version of a modal dialog that I found in this forum today:

Expand|Select|Wrap|Line Numbers
  1.  
  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <title>Data Passing</title>
  6.  
  7. <script type="text/javascript">
  8. function abc()
  9. {
  10. var wind1=null;
  11. var tmp=null;
  12. wind1 = window.open('', 'displayWindow', 'width=200,height=300,status=no,toolbar=no,menubar =no,scrollbars=1');
  13. wind1.document.write("<script> function alert1(f){");
  14. wind1.document.write("var frmdst=f.ta.value;");
  15. wind1.document.write("window.opener.tmp=frmdst;");
  16. wind1.document.write("window.opener.getValues();") ;
  17. wind1.document.write("window.close();");
  18. wind1.document.write("}<\/script>");
  19. wind1.document.write("<html><body><form action='#' name='myform' action='post'><TEXTAREA rows='4' cols='20' name='ta'></TEXTAREA><br><INPUT type='button' value='save' onclick='javascript:alert1(this.form);'><INPUT type='button' value='cancel' onclick='javascript:window.close();'></form></body></html>");
  20. }
  21. function getValues()
  22. {
  23. document.forms["source"].elements["srctext"].value = tmp;
  24. }
  25.  
  26. </script>
  27. </head>
  28. <body>
  29. <form action="#" name="source" method="get">
  30. <input type="text" onclick='abc();' name="srctext" value="" style="width:300px;height:200px;" />
  31. </form>
  32. <body>
  33. </html>
  34.  
  35.  
One of the issues I have found with this code is that carriage returns are not reflected when you type in the dialog box. Does anyone know of a way to solve this issue?

So I have several questions:

1. Is there a way to fix the 403 forbidden errors in the attached code?

2. Is there a way to fix the formatting problems in the javascript so it formats properly in the attached code?

3. Is there a way to have the carriage return/new line reflected correctly in the old school text box?

Thanks so much for your help.

Regards,
seeker
Attached Files
File Type: txt update-my-company-information8.html.txt (23.3 KB, 189 views)
Jan 27 '12 #1
Share this Question
Share on Google+
2 Replies


acoder
Expert Mod 15k+
P: 16,027
1. Here's Google CDN for jQuery UI:
http://code.google.com/apis/librarie....html#jqueryUI

2. What kind of formatting errors?
Jan 28 '12 #2

P: 4
Thanks for your response. So linking to the CDN does not help, and downloading the images and the code to the local server does not help either. The jquery ui modal images do not work, so I probably have to check the path of each of the images. I became aware of jquery forbidding linking to the jqueryui.com server, so that answered the 403 error problem, however it still does not solve the problem of the images failing to load even though you put them all on the server.

The formatting problem when the images are loading correctly is that the input from the dialog box pushes the data far down to the center portion of the text area, and the first line is indented by 50pixels.

Not a good solution. I am working on "plan B" scrapping the jquery modal for an "old school" solution.
Jan 28 '12 #3

Post your reply

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