Search jQuery

jQuery Forum

Screen name:
frommm

frommm's Profile

23 Posts

81 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

Upgrading from 1.12.4 to 3.5
[0Replies]
- 06-Jun-2020 11:58 PM
- Forum: Using jQuery
I ran the migrate script in a simple page.
<script src="https://code.jquery.com/jquery-migrate-3.3.0.js"></script>

It flagged using $ and to use jQuery. Every tutorial I could find using jQuery 3.5 still uses $ and not jQuery. Must I updated my all my code from $ to jQuery?

The other flag on this simple page was to replace .ckick with .on('click', )
$('.trggr').click(function (e) { });
jQuery('.trggr').on('click',function (e) { });

Plus it flagged a things not in my page but in jquery itself, like the following.
jquery-migrate-3.3.0.js:100 JQMIGRATE: jQuery.event.fixHooks are deprecated and removed: focus
migrateWarn @ jquery-migrate-3.3.0.js:100
jQuery.event.fix @ jquery-migrate-3.3.0.js:594
c @ jquery-1.12.4.min.js:3
jquery-migrate-3.3.0.js:102 console.trace
migrateWarn @ jquery-migrate-3.3.0.js:102
jQuery.event.fix @ jquery-migrate-3.3.0.js:594
c @ jquery-1.12.4.min.js:3
jquery-migrate-3.3.0.js:100 JQMIGRATE: jQuery.event.fixHooks are deprecated and removed: blur
migrateWarn @ jquery-migrate-3.3.0.js:100
jQuery.event.fix @ jquery-migrate-3.3.0.js:594
c @ jquery-1.12.4.min.js:3
jquery-migrate-3.3.0.js:102 console.trace

I reviewed https://github.com/jquery/jquery-migrate/blob/master/warnings.md, but is there a quick reference of things that must be changed so code running in 1.12.4 will function in 3.5.1?

My simple page does not work with the migrate code running.
2. <script type="text/javascript">
3. jQuery(document).ready(
4. function(){
5. jQuery('.trggr').on('click',function (e) {
6. jQuery(this).closest("tr").next().find('.moreinfo').slideToggle();
7. e.preventDefault();//prevent page from scrolling to top after click
8. return false;
9. });
10. }
11. );
12. </script>

cannot call methods on dialog prior to initialization
[3Replies]
- 05-Jun-2020 11:48 PM
- Forum: Using jQuery UI
I'm receiving this error in the console log.
2. jquery-1.12.1.min.js:2 Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'destroy'
3. at Function.error (jquery-1.12.1.min.js:2)
4. at HTMLDivElement.<anonymous> (jquery-ui-1.12.1.min.js:6)
5. at Function.each (jquery-1.12.1.min.js:2)
6. at n.fn.init.each (jquery-1.12.1.min.js:2)
7. at n.fn.init.t.fn.<computed> [as dialog] (jquery-ui-1.12.1.min.js:6)
8. at HTMLDivElement.OK (new_appointment.php:901)
9. at HTMLButtonElement.<anonymous> (jquery-ui-1.12.1.min.js:11)
10. at HTMLButtonElement.dispatch (jquery-1.12.1.min.js:3)
11. at HTMLButtonElement.r.handle (jquery-1.12.1.min.js:3)
12. error @ jquery-1.12.1.min.js:2
13. (anonymous) @ jquery-ui-1.12.1.min.js:6
14. each @ jquery-1.12.1.min.js:2
15. each @ jquery-1.12.1.min.js:2
16. t.fn.<computed> @ jquery-ui-1.12.1.min.js:6
17. OK @ new_appointment.php:901
18. (anonymous) @ jquery-ui-1.12.1.min.js:11
19. dispatch @ jquery-1.12.1.min.js:3
20. r.handle @ jquery-1.12.1.min.js:3
I searched extensively for an answer and found several people stating, "loading the jquery library on the partial page as well as the main page," caused the error for them.

I checked my pages for this particular webpage and jquery is only loaded once, in my nav.php include file, which is included in the main php page for this particular webpage.

The error only happens when I click a "close" button on a dialog box, in which the item being closed, an appointment form that is not full, has no form data.
The close function
2. "OK":function(){
3. $("#close").dialog('destroy');
4. //put excuse dialog here
5. if(closeFull){
6. $('#cancelReason').dialog({
7. modal:true,
8. draggable:false,
9. width:370,
10. resizable:false,
11. buttons:{
12. "Cancel":function(){
13. document.cancelForm.reset();
14. $("#cancelReason").dialog('destroy');
15. },
16. "OK":function(){
17. var rea = $("#reason").val();
18. $("#cancel_reason").val(rea);
19. //alert($("#cancel_reason").val());
20. $.post("close.php?action=closed",$("#newappointmentform").serialize(),function(data){
21. //debug
22. //alert(data);
23. },"text");
24. $.ajax({
25. type:'POST',
26. cache:false,
27. url:'query.php',
28. data:{date:selectedDate,id:appointment_id},
29. success:showSched
30. });
31. $("#cancelReason").dialog('destroy');
32. document.cancelForm.reset();
33. }
34. }
35. });
36. }
37. else
38. {
39. $.post("close.php?action=closed",$("#newappointmentform").serialize(),function(data)
40. {
41. //debug
42. //alert(data);
43. },"text");
44. document.newappointmentform.reset();
45. $("#formWindow").dialog('destroy');
46. }
47. }

updating code from attr to prop
[13Replies]
- 10-Jul-2018 12:20 PM
- Forum: Using jQuery
In the process of moving some jquery code to a site that uses a newer version of jquery, I had to change from using attr to prop as shown below.
2. jquery-1.3.2.js
3. if (!($("[name=jobs_ws]").attr("checked"))) {
5. jquery-1.10.2.js
6. if ($("[name=jobs_ws]").prop("checked")) {
After reading up on attr vs prop I'm still unclear on which attr and removeAttr should be clanged to prop in the code below. Currently the only problem is that only in IE11 the checkbox for "phone_appointment" and "have_file" are not being populated with a check when data.phone_appointment=='t' and data.have_file=='t'. In Chrome there is a check in the box, if they are equal to true.
2. $(".open").click(function(event){
3. //the time of the appointment is stored in the href of the open link
4. $("#time").attr("value",$(this).attr("href"));
5. $("#counselor_name").attr("value",$(this).attr("title"));
6. $("#formWindow").attr("title","Set New Appointment");
8. //cancel the normal click behavior (following the link)
9. event.preventDefault();
11. //Clear data and Show the form
12. $("#phone_appointment").removeAttr('checked');
13. $("#have_file").removeAttr('checked');
14. $("#email_address").attr("value",'');
15. $("#phone_number").attr("value",'');
16. $("#timezone").attr("value",'');
17. $("#creator_initials").attr("value",'');
18. showForm();
19. });
22. $(".full").click(function(event){
23. clicked = $(this);
24. //stop the default click behavior
25. event.preventDefault();
26. $("#time").attr("value",$(this).attr("href"));
27. $("#counselor_name").attr("value",$(this).attr("title"));
28. $("#date").attr("value",selectedDate);
29. $("#formWindow").attr("title","Edit Appointment");
31. //POST TO LOOKUP.PHP for information
32. $.post('lookup.php',{date:selectedDate,time:$(this).attr("href")},function(data){
33. $("#time").attr("value",data.appointment_time)
34. $("#email_address").attr("value",data.email_address);
35. $("#creator_initials").attr("value",data.creator_initials);
36. $("#phone_number").attr("value",data.phone_number);
38. if(data.phone_appointment=='t'){
39. $("#phone_appointment").attr("checked","true");
40. } else {
41. $("#phone_appointment").removeAttr('checked');
42. }
44. if(data.have_file=='t'){
45. $("#have_file").attr("checked","true");
46. } else {
47. $("#have_file").removeAttr('checked');
48. }
49. },"json");
51. showForm('full');
52. });
Thanks

How to upgrade select option code
[22Replies]
- 05-Apr-2018 08:44 PM
- Forum: Using jQuery
I have some jquery code that is quite old that uses "removeOption(/./).addOption(cats_reg, false)" to change the select options based on a checkbox. The version of jquery is jquery-1.3.2.js.

I have to move my code to where jquery 1.10.2 is being used. The code removeOption(/./).addOption(cats_reg, false) is no longer functions in the new jquery.
2. $("#offcampus_ws_box").click(function(){
3. $(".offcampws").toggle();
4. $(".chngtxt").toggle();
5. if (cats_reg !== undefined) {
6. if (!($("[name=jobs_workstudy]").attr("checked"))) {
7. $("[name=jobs_categories_name]").removeOption(/./).addOption(cats_reg, false);
8. if (!wasWorkstudy){
9. document.form.jobs_categories_name.selectedIndex=selected;
10. }
11. } else {
12. $("[name=jobs_categories_name]").removeOption(/./).addOption(cats_ws, false);
13. $("#benefits_text").html("<strong>Educational Benefits:</strong>");
14. if (wasWorkstudy){
15. document.form.jobs_categories_name.selectedIndex=selected;
16. }
17. }
18. }
19. });
If it helps, cats_reg and cats_ws select option items are created as follows in php:
2. $cats_reg = "SELECT categories_name FROM ...";
3. $r = pg_query($conn, $cats_reg) or die(pg_last_error());
4. echo "var cats_reg = {\n";
6. $num = pg_num_rows($r);
7. for ($i=0; $i<$num; $i++) {
8. $d = pg_fetch_row($r,$i);
10. echo "\"$d[0]\"" . " : " . "\"$d[0]\"";
11. if ($i<($num-1)){
12. echo",\n";
13. }else{
14. echo"\n";
15. }
16. }
17. echo "};\n";
20. $cats_ws = "SELECT categories_name FROM ...";
21. $r = pg_query($conn, $cats_ws) or die(pg_last_error());
22. echo "var cats_ws = {\n";
23. $num = pg_num_rows($r);
24. for ($i=0; $i<$num; $i++) {
25. $d = pg_fetch_row($r,$i);
27. echo "\"$d[0]\"" . " : " . "\"$d[0]\"";
28. if ($i<($num-1)){
29. echo",\n";
30. }else{
31. echo"\n";
32. }
33. }
34. echo "};\n";
35. }
What is the equivalent or how do I upgrade the code to have it work in the new jquery?

Thanks

Updating hide and show code problem
[3Replies]
- 06-Sep-2017 01:20 PM
- Forum: Using jQuery
I'm updating some jquery hide and show code. The new code works on other pages. The difference is the new code on the working pages do not use the table tr and td tags. I think the tr and td tags are interfering or causing the div to be too far removed from the triggering anchor tag.

Old code that uses an old hidenshow.js include script
1. $(document).ready(function(){
  $('.show_hide').showHide({
  speed: 1000,
  easing: '',
  changeText: 0
  });
  ...
  
  <tr>
  <td><a class="show_hide" rel="#slidingDiv3" href="#">Completed:</a></td>
  </tr>
  <tr>
  <td>
  <div id="slidingDiv3">hiden text to show when clicking on Completed above</div>
  </td>
  </tr>
New code using only the jquery library
1. $(document).ready(function(){
  $(function () {
  $('.trggr').click(function (e) {
  $(this).siblings('.moreinfo').slideToggle(300);
  return false;
  e.preventDefault();//prevent page from scrolling to top after click
  });
  });
  ...
  
  <tr>
  <td><a class="trggr" href="#">Completed:</a></td>
  </tr>
  <tr>
  <td>
  <div class="moreinfo">hiden text to show when clicking on Completed above</div>
  </td>
  </tr>

IE11 TypeError
[3Replies]
- 11-May-2017 06:24 PM
- Forum: Using jQuery
I'm doing calcualtions with jquery and all works well in firefox. In IE11 I get the following message, "TypeError: Object doesn't support property or method 'trunc'"

I'm using trunc to drop the decimals. What does IE11 need for trunc to work? Thanks.
1. function calculate_net(loan_table){
      $(loan_table + " input[name=net]").calc(
      // create the equation
      "(borrowed_v) - (lofa_v)",
      // define the variables used in the equation
      {
          borrowed_v: $(loan_table + " input[name=borrowed]"),
          lofa_v: $(loan_table + " input[name=lofa]")
      },
  
      function (s){
          if (isNaN(s)){
              return "0";
          } else {
              return Math.trunc(s);
          }
      }
      );
  }

data-role collapsible not opening at top of content
[19Replies]
- 22-Dec-2016 04:26 PM
- Forum: jQuery Mobile
I'm using jquery mobil 1.4.5.min.js.

If a data-role collapsible content is already expanded, displaying its content, and then I tap on a second data-role collapsible heading to expand its content, the content expands but scrolled down the content the distance that the first collapsible content was expanded. Thus the first expanded content always opens at the top of the content (which is good), while any following expanded content does not open at the top of its content.

Is there a parameter to control where the expanded content opens at, on the screen?

As shown in screen shots, image 1.png is the first expanded content, open at the top (start of content). Image 2.png is where the second expanded content opens up at (scrolled down a ways). Image 3.png is where I would like image 2.png to open up at (not scrolled down the screen).

Thanks
Attachments
- 1.PNG
  
  Size: 76.32 KB Downloads: 201
- 2.PNG
  
  Size: 103.55 KB Downloads: 182
- 3.PNG
  
  Size: 76.86 KB Downloads: 177

using .html() with .text()
[1Reply]
- 03-Aug-2015 02:12 PM
- Forum: Using jQuery
To solve a problem with double quotes breaking my code in a text area, I found a solution online to convert the double quote character to an html entity (") before storing it in the database. The solution then instructed to use $(#comments).html(data.comments).text() to display the text and have the " display as a double quote. This all works.

My actual question is what is the .text() doing at the end of the statement, or is it not needed?

Thanks

using replace on val()
[9Replies]
- 03-Mar-2015 04:04 PM
- Forum: Using jQuery
This bit of code works great, removing the commas from numbers to do math.
1. for(i=1; i<$('.coa_table tr').length; i++){
      var c_trs=parseInt($('.coa_table tr:eq('+i+')').find('td:last').text().replace(',', ''));
      c_count+=c_trs;
     }
I cannot figure out why I cannot do the same with .val() as the above .text(). This code errors with "Object doesn't support property or method 'replace'" on valhold.replace(',', ''). The code is retrieving the value from multiple input type="text" fields with a class="c_cell".
1. $(this).prevAll().each(function () {
       var valhold = parseInt($(this).children('.c_cell').val());
       valhold = valhold.replace(',', '');
       totalVal += valhold || 0;
      });

Dialog box only works after page refresh
[13Replies]
- 18-Aug-2014 05:03 PM
- Forum: jQuery Mobile
I followed a tutorial for making an anchor tag open a second page as a dialog box, from an icon in the footer. On the desktop the dialog box opens fine and I can close it to return to the main page.

On mobile devices the dialog box does not open unless I first refresh the main page. I'm using jquery.mobile-1.4.3.min.js
1. <footer data-role="footer" data-position="fixed">
    <nav data-role="navbar">
     <ul>
      <li><a href="#info" data-icon="info" data-rel="dialog">Info</a></li>
     </ul>
    </nav>
  </footer>
2. <div data-role="page" id="info" data-theme="a">
    <header data-role="header">
     <a href="#fac" data-icon="back" data-iconpos="notext"></a>
     <h1>Hours and Location</h1>
    </header>
    <article data-role="content">
    <p>Open 9am - 4pm Monday - Friday</p>
    <p>Old Main 265</p>
    </article>
  </div>
I have looked at several tutorials and all are similar, some use data-rel="dialog" in the anchor tag while others use data-role="page" data-dialog="true" in the actual dialog box code. Either way produces the same result. It only works after a refresh.

What is missing that the tutorials have not shown?

thanks

Works as stand alone but not if ncluded in a page
[6Replies]
- 12-Aug-2014 06:59 PM
- Forum: Using jQuery
I'm creating a template page. I am including a page called menu.php which creates a jquery vertical menu. If I run menu.php directly in the browser the menu displays and functions fine.

If I included the menu.php page into my template page the menu is broken with a console message:
1. <!DOCTYPE html>
  <html>
  <head>
  <title>Template</title>
  
  <link rel="stylesheet" type="text/css" href="../css/6807.css" />
2. </head>
  <body>
      <div id="wrapper">
          <div id="header">
              <? require ($_SERVER['DOCUMENT_ROOT'] . "/template/includes/header.php") ?>
          </div>
          <div id="leftcolumn">
              <? require ($_SERVER['DOCUMENT_ROOT'] . "/template/includes/menu/menu.php") ?>
          </div>
          <div id="content">
This is the console message that I get when including menu.php into my template page.

ReferenceError: $ is not defined
$(function() {
This is part of the menu.php page
1. <link rel="stylesheet" href="dropdown-menu.css" />
  <script src="jquery-1.11.1.min.js"></script>
  <script type="text/javascript" src="dropdown-menu.min.js"></script>
2. <script type="text/javascript">
  $(function() {
      $('#example4').dropdown_menu({
          sub_indicators : true,
          vertical : true
      });
  });
  </script>
3. <style type="text/css">
  #example4 {
  width: 250px;
  }
  </style>
4. <ul id="example4" class="dropdown-menu">
I tried referencing jquery from both the menu.php page as shown and in the main template page.

Based on the error I assume jquery is not being loaded but I cannot see why.

Using a variable in a function
[18Replies]
- 30-Jul-2014 05:34 PM
- Forum: Using jQuery
I am exploring this highlight script found here http://bartaz.github.io/sandbox.js/jquery.highlight.html.

The script allows an array of items to highlight by simply providing ["one", two", "three"] as a parameter, which works.
1. $(".content").highlight( ["one", two", "three"] ); //words are found and highlighted
I tried making the list dynamic thus is a variable I have stored "one", two", "three", including the quotes, which displays in the firebug console, yet the highlight function does not like the input. There are no error messages, just the words one two three are not highlighted, even though they are when put in as shown above.
1. var nlist = msg.n_list; //msg.n_list contains the string "one", two", "three", including the quotes
  console.log("n_list: " + nlist); // dislays "one", two", "three"
  $(".content").highlight([nlist]); //words are not found and highlighted
Can I not populate the parameter with a string that contains the double quotes?

code flow not making sense
[5Replies]
- 05-May-2014 02:38 PM
- Forum: Using jQuery
The code flow is not making sense. The "on keyup" event for a text box executes an ajax post to a php page. If a match is found, the php page returns {"duplicate":"Yes"} and the jquery executes the code in the code block for if(msg.duplicate == 'Yes'){ ... } and plays a sound. If a match is not found the php page returns {"duplicate":"No"} and a sound is not played.
No sound is played until msg.duplicate == 'Yes' for the first time, which is good. What's bad is, once the sound is played for the first time, and I then change the input in the text box so {"duplicate":"No"} is retuned, the sound is still played even though the $('#matchAudio')[0].play() command is only inside the if(msg.duplicate == 'Yes'){ ... } code block.
How is code inside the if(msg.duplicate == 'Yes'){ ... } code block being executed if the program flow is inside the if(msg.duplicate == 'No'){ ... } code block?

I tried putting a $('#matchAudio')[0].pause() command in the if(msg.duplicate == 'No'){ ... } code block, but that still did not prevent the sound from playing after the first time the sound was played.
1. $(document).ready(function(){
  $('<audio id="matchAudio"><source src="notify.ogg" type="audio/ogg"><source src="notify.mp3" type="audio/mpeg"></audio>').appendTo('body');
  
  $lkpchkbxs_m.on('keyup', lookup_check);
  
  function lookup_check() {
    var jqXHR = null;
    var lkpchkbxs = $lkpchkbxs_m.val();
    var lkpchkbxtype = $lkpchkbxtype_m.filter(':checked').val();
    //var lkpchkbxtype = $("input:radio[name=lookupchkbxs_option]:checked").val();
    var label_l = "<label>Live Search - Full:</label>";
    if ($.trim(lkpchkbxs) != ''){
     console.log("lookup: " + lkpchkbxs + " | " + lkpchkbxtype);
     if(jqXHR != null){
      jqXHR.abort();
     }
     jqXHR = $.ajax({
      type: "POST",
      url: "check.php",
      data: {"lkpchkbxs" : lkpchkbxs, "lkpchkbxtype" : lkpchkbxtype, "chkbxs_m" : "lookup"},
      dataType: "JSON",
      success: function(msg) {
       $(document).ajaxComplete(function(event,request,settings){
        if(msg.duplicate == 'Yes'){
         $status_l.html (label_l + '<img src="check.png">Search Finished.');
         $result_l.html('');
         $result_l.append('<img src="arrow.png"><b>' + msg.n_date);
         $result_l.append(':</b> ');
         $result_l.append(msg.search_string);
         $('#matchAudio')[0].play();
        } else if(msg.duplicate == 'No') {
         $status_l.html (label_l + '<img src="loader.gif">Searching...');
         $result_l.html('');
         if(msg.length == 6 && msg.num_boxes == "49"){
          $status_l.html (label_l + '<img src="check.png">Search Finished.');
          $result_l.append('<img src="close.png">Match not found.');
         }
         if(msg.length == 5 && msg.num_boxes == "39"){
          $status_l.html (label_l + '<img src="check.png">Search Finished.');
          $result_l.append('<img src="close.png">Match not found.');
         }
        }
       });
      }
     });
    } else {
     $status_l.html ('');
     $result_l.html('');
    }
  }
  });

audio works in IE9 but not IE11
[12Replies]
- 30-Apr-2014 01:55 PM
- Forum: Using jQuery
I have some jquery code that calls a function called playSound, which plays a sound file when a dialog box opens. The sound file plays in firefox but not in IE11. It even plays in IE9. Does IE11 require some specific programming? I'm using jquery-1.8.3.min.js
1. function playSound(soundfile){
  $('#dummy').html("<audio autoplay='autoplay'><source src='" + soundfile + "wav' type='audio/wav' /><source src='" + soundfile + "mp3' type='audio/mp3' />Audio tag not supported.</audio>");
  }
2. playSound("media/alert.");
  $("#arrivalNotification").dialog("open");
  if(soundTimer){
  clearInterval(soundTimer);
  }
  soundTimer=setInterval(function() {playSound('media/alert.');}, chimeDelay);

single quotes in data break the page
[1Reply]
- 13-Dec-2013 05:58 PM
- Forum: Using jQuery
I have a php page that populates a form from data pulled from a postgresql database. Jquery is used to populate the form with the pulled data as below. If any piece if data has a single quote in it, like Jim's the the form is displayed but no data is populated in any field.
1. $(document).ready(function(){
          <?
              $i=0;
              foreach($keys as $key){
  
                  if ($i%2==1){
                      if($key!="reason" && $key!="parent_deceased" && $key!="to_account" && $key!="dispersed"){
                          echo("$('input[name=\"".$key."\"]').attr('value','".$queryResults[$key]."');\n");
                      }
                  }//end if
                  $i++;
              }
2. ...
3. <div class="textField left">
                                  First Name:
                              </div>
                              <div class="inputField left">
                                  <input type="text" class="inputbox req-string" name="studentfname">
                              </div>
                              <div class="textField left">
                                  Last Name:
                              </div>
                              <div class"inputField">
                                  <input type="text" class="inputbox req-string" name="studentlname">
                              </div>

error checking
[8Replies]
- 05-Feb-2013 04:49 PM
- Forum: Using jQuery
I have a small form with 6 input boxes. A number is put in each box and totaled in a 7th box.

I want to check that a number was entered in each box. If not then report an error.

My code works if a non-numeric character is entered in the first box, but not for boxes 2 to 6.

This is my jquery code. In the html each textbox has the same name "sum_cc" the total box is "ac". I am using the same name for each input box to sum the values as entered. My understanding was for each box after typing in it the code below would execute and either report an error or sum the values as entered.
1. $(document).ready(
    function(){
  
     $("input[name^=sum_cc]").keyup(function(){
      var cqcc = $("input[name^=sum_cc]").val();
      if (isNaN(cqcc) || cqcc == ''){
       alert ("Please enter a value!");
       $("input[name^=sum_cc]").addClass('error');
      } else {
       $("input[name^=sum_cc]").sum("keyup","#ac");
       $("input[name^=sum_cc]").removeClass('error');
      }
     }); }
  );

messy cross browser problem
[2Replies]
- 15-Oct-2012 12:20 PM
- Forum: Using jQuery
I am maintainning a schedueling system built with jquery and php that I did not write. As shown in the image there are links that say Full or Open. If you click on the Full link it shows the details of the appintment. If you click on the Open link it should open a blank form so you can enter the appointment information.

In IE clicking on Open always opens a blank form, which is good. In Firefox clicking on Open fills the form with the previous clicked on Full forms information, instead of opening a blank form, which is bad. FireFox only opens a blank form if the user's first click is on an Open link.

Here is the messy code. I appologize for the amount of code and hope it makes sense. I bolded the section for clicking the Open link. Since only FireFox populates an Open slot with the previous viewed Full slot, I figure it must be the jquery running on the client that is causing the problem.
1. // Dialogue call change edit appointment box
    //alert($("#date").val());
     $("#formWindow").dialog(
     {
        //Edit appointment box properties
        modal:true,
        autoOpen:false,
        width:500,
        draggable:false,
        resizable: false,
        close: function(event,ui)
         {
           $("#logLink").css("display","none");
           $("#alertLink").css("display","none");
           $("#time").attr("value",$(this).attr("href"));
           $("#formWindow").dialog('destroy');
           $("#newappointmenttable label").css("display","none");
           $('#log').html('');
           $('#alertCounselor').html('');
           document.newappointmentform.reset();
           $("#date").val(selectedDate);
         }
     });
     $("#formWindow").dialog("option","buttons",buttons);
     $("#formWindow").dialog("open");
     }
  
     function showSched(data)
     {
     $("#sched").html(data);
  
  
     var tmpDate = cDate.getMonth()+1;
     if(tmpDate < 10)
     {
     tmpDate = "0"+tmpDate;
     }
     var tmp = cDate.getDate();
     var dateStr = cDate.getFullYear()+"-"+tmpDate+"-"+tmp;
2.    if(dateStr == selectedDate)
     {
     $(".status").html("Full/Check-in");
     }
  
  
  
  
     if($("#sched").css('display')=="none")
     {
     $("#sched").show('slide',{direction:'left'},350);
     }
  
  
     //crappy active wait to wait for the database to update
     function wait(mill)
     {
     var date = new Date();
     var curDate = null;
  
     do { curDate = new Date(); }
     while(curDate-date < mill);
     }
  
     //this is where we build the form popup
     //if they click the open link
     $(".open").click(function(event){
     //the time of the appointment is stored in the href of the open link
     $("#time").attr("value",$(this).attr("href"));
     $("#counselor_name").attr("value",$(this).attr("title"));
     $("#formWindow").attr("title","Set New Appointment");
     //cancel the normal click behavior (following the link)
     event.preventDefault();
     //show the form
     $("#phone_appointment").removeAttr('checked');
     $("#have_file").removeAttr('checked');
     showForm();
     });
  
     //if they wish to edit a previously sched. appointment.
     //by clicking on a full appointment
     $(".full").click(function(event)
     {
     clicked = $(this);
     //stop the default click behavior
     event.preventDefault();
     $("#time").attr("value",$(this).attr("href"));
     //alert($("#time").attr("value"));
     $("#counselor_name").attr("value",$(this).attr("title"));
     $("#date").attr("value",selectedDate);
     $("#formWindow").attr("title","Edit Appointment");
     //POST TO LOOKUP.PHP for information
     $.post('lookup.php',{date:selectedDate,time:$(this).attr("href")},function(data){
        //repopulate the submission form
        //alert(data);
        $('#logLink').css('display','none');
        $('#alertLink').css('display','none');
        $("#student_first_name").attr("value",data.student_first_name);
        $("#student_last_name").attr("value",data.student_last_name);
        $("#time").attr("value",data.appointment_time)
        $("#student_number").attr("value",data.student_number);
        $("#creator_initials").attr("value",data.creator_initials);
        $("#aid_year").attr("value",data.aid_year);
        $("#callers_name").attr("value",data.callers_name);
        $("#callers_relationship").attr("value",data.callers_relationship);
        $("#timezone").attr("value",data.timezone);
        $("#phone_number").attr("value",data.phone_number);
        $("#comments").attr("value",data.comments);
        $("#appointment_id").attr("value",data.appointment_id);
  
        if(data.phone_appointment=='t')
        {
        $("#phone_appointment").attr("checked","true");
        } else
        {
        $("#phone_appointment").removeAttr('checked');
        }
  
        if(data.have_file=='t')
        {
        $("#have_file").attr("checked","true");
        } else
        {
      $("#have_file").removeAttr('checked');
        }
  
        $.post('log.php',{student_number:data.student_number},function(data)
         {
        if(data)
        {
           $('#log').html(data);
           $('#logLink').css('display','table');
        }
         },'html');
         $.post('alert.php',{student_number:data.student_number},function(data)
         {
        if(data)
        {
           $('#alertCounselor').html(data);
           $('#alertLink').css('display','table');
        }
         },'html');
     },"json");
  
     showForm('full');
     });
     $('#logLink').click(function(event){
     $('#log').dialog({
        modal:true,
        draggable:false,
        width:250,
        resizable:false,
        buttons: {
        "OK":function()
        {
        $('#log').dialog('destroy');
        }
        }
        });
     });
     $('#alertLink').click(function(event){
     $('#alertCounselor').dialog({
        modal:true,
        draggable:false,
        width:350,
        resizable:false,
        buttons: {
        "OK":function()
        {
        $('#alertCounselor').dialog('destroy');
        }
        }
        });
     });
     $(".closebutton").click(function(event){
        //stop the click behavior
     event.preventDefault();
     //set all the values on the form
     $("#time").attr("value",$(this).attr("href"));
     $("#counselor_name").attr("value",$(this).attr("title"));
     closeFull=$(this).hasClass('closeFull');
     $("#date").attr("value",selectedDate);
     $("#close").dialog({
  
        modal:true,
        draggable:false,
        width:370,
        resizable:false,
        buttons: {
           "Cancel":function()
           {
           $("#close").dialog('destroy');
           },
           "OK":function()
           {
           $("#close").dialog('destroy');
           //put excuse dialog here
           if(closeFull)
           {
           $('#cancelReason').dialog({
              modal:true,
              draggable:false,
              width:370,
              resizable:false,
              buttons:{
              "Cancel":function()
              {
              document.cancelForm.reset();
              $("#cancelReason").dialog('destroy');
              },
              "OK":function()
              {
              var rea = $("#reason").attr("value");
              $("#cancel_reason").attr("value",rea);
              //alert($("#cancel_reason").attr("value"));
              $.post("close.php?action=closed",$("#newappointmentform").serialize(),function(data)
              {
              //debug
              //alert(data);
              },"text");
              $.ajax({
              type:'POST',
              cache:false,
              url:'query.php',
              data:{date:selectedDate,id:appointment_id},
              success:showSched
              });
              $("#cancelReason").dialog('destroy');
              document.cancelForm.reset();
              }
              }
           });
           }
           else
           {
           $.post("close.php?action=closed",$("#newappointmentform").serialize(),function(data)
           {
              //debug
              //alert(data);
           },"text");
           document.newappointmentform.reset();
           $("#formWindow").dialog('destroy');
           }
           }
        }
     });
     });
  
     $(".openbutton").click(function(event){
        //stop the click behavior
     event.preventDefault();
     //set all the values on the form
     $("#time").attr("value",$(this).attr("href"));
     $("#appointment_id").attr("value",$(this).attr("name"));
     $("#counselor_name").attr("value",$(this).attr("title"));
     $("#date").attr("value",selectedDate);
     $("#open").dialog({
  
        modal:true,
        draggable:false,
        width:370,
        resizable:false,
        buttons: {
           "Cancel":function()
           {
           $("#open").dialog('destroy');
           },
           "OK":function()
           {
           $("#open").dialog('destroy');
           $.post("close.php?action=open",$("#newappointmentform").serialize(),function(data)
           {
              //debug
              //alert(data);
           },"text");
           document.newappointmentform.reset();
           $("#formWindow").dialog('destroy');
           }
        }
     });
     });
     }

passing select value to php variable
[13Replies]
- 28-Jul-2012 01:06 AM
- Forum: Using jQuery
I am at an impass.

I want to pass the value of the selected drop down menu selected option. To a php variable that will be used in a MySQL statement, which in turn will alter a second drop down menu. Here is what happens. When I make my selection from the first drop down menu nothing changes on the second drop down menu. After I clicked the submit button then the change takes place. What do I need to do to make the change take place with out having to click the submit button? Thanks for any help, since I am stuck.
1. <script type="text/javascript">
    $(document).ready(
     function(){
     $('#selFaxType').click(function() {
      //var selFaxTypeID = $('#selFaxType option:selected').val();
      var selFaxTypeID = $('#selFaxType').val();
      $("input[name=selFTID]").val(selFaxTypeID);
      $.post("fax_details.php", {selFTID: selFaxTypeID}, function(data){});
     });
     $('.datepicker').datepicker();
     }
    );
  </script>
3. //Get value from POST
  <?
  $selFTID = CleanNumber($_POST['selFTID']);
5. //MySQL statement
  <select name="selFaxSubType" id="selFaxSubType" size=1>
  <option value=""></option>
6. <?php
  echo "selFTID: $selFTID <br />";
  $strSQL = 'SELECT fax_sub_type_id, fax_sub_type FROM fax_sub_types WHERE fax_type_id ="'. $selFTID . '" AND fax_sub_type_disable=0 ORDER by fax_sub_type';
8. //Store value in a hidden field
  <input name="selFTID" id="selFTID" type="hidden" value="<?=$selFTID?>" />

playSound
[10Replies]
- 21-Feb-2012 12:12 PM
- Forum: Using jQuery
I inherited some jquery code for a site. Thus I did not write it. Part of the code plays a sound when a dialog box opens. The sound plays in firefox. The sound used to play in IE but now it does not.

This is the code that plays the sound. The popup has a snooze function thus the code has some timer stuff.
1. function playSound(soundfile)
    {
     document.getElementById("dummy").innerHTML="<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
    }
2. if(timer)
        {
         clearInterval(timer);
        }
        playSound("images/alert.wav");
        $("#arrivalNotification").dialog("open");
        if(soundTimer)
        {
         clearInterval(soundTimer);
        }
        //alert("starting");
        soundTimer=setInterval("playSound('images/alert.wav')",chimeDelay);

same code works on one page but not another
[5Replies]
- 09-Jan-2012 04:51 PM
- Forum: Using jQuery
I am using jquery to popup a calendar. I have done this on several pages with not problems this one page keeps claiming the error below.

Message: Object doesn't support this property or method
Line: 24
Char: 1
Code: 0
1. <head>
  <title>SMSD</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <link href="/lan/_includes/style.css" rel="stylesheet" type="text/css">
2. <link href="jquery/UIcss/ui-lightness/jquery-ui-1.8.7.custom.css" rel="stylesheet" type="text/css" />
  <style type="text/css" media="all">
  div.ui-datepicker{
  font-size:11px;
  }
  </style>
3. <script type="text/javascript" src="jquery/jquery-1.4.2.min.js"></script>
  <script type="text/javascript" src="jquery/jquery-ui-1.8.7.custom.min.js"></script>
  <script type="text/javascript" src="jquery/jquery.selectboxes.js"></script>
4. <script type="text/javascript">
  $(document).ready(function(){
  $('.datepicker').datepicker(); // Debug claims object error at this line (line 24)
  });
5. </script>
6. </head>
7. ...
8. <input type="text" name="deadline" class="liten datepicker" value="<? printf("%s", $r->deadline); ?>">

looking for a better way
[3Replies]
- 16-Nov-2011 01:34 PM
- Forum: Using jQuery
I have some jquery code that is adding the number entered in the text box to a set number, and then calculates a percent. The second textbox adds the numbers in boxs 1 and 2 to a set number and then calculates a percent. And so on ....

I currently check if a number is in a textbox and then add up all the textboxes prior to the current texbox being checked. This is ok for on 6 boxes but if I wanted to hav 20 boxes it would get out of hand. I'm trying ot find a better way to add the values in the textboxes other than having 6 separate statments that add one and two, then one, two, and thre, then one two three four, and so on. The code below shows the long tedious mehtod I am using.
1. $("input[name^=q]").keyup(function(){
      var totalac = parseInt($("input[name=total_ac]").val());
      var totalcc = parseInt($("input[name=total_cc]").val());
      var newcredits1 = parseInt($("input[name=q1_credits]").val());
      var newcredits2 = parseInt($("input[name=q2_credits]").val());
      var newcredits3 = parseInt($("input[name=q3_credits]").val());
      var newcredits4 = parseInt($("input[name=q4_credits]").val());
      var newcredits5 = parseInt($("input[name=q5_credits]").val());
      var newcredits6 = parseInt($("input[name=q6_credits]").val());
  
      var newpace = calculate_new_pace(totalcc,totalac,newcredits1);
      newpace = decimal_trunc(newpace);
      $("input[name=pace_percent_result1]").val(newpace);
  
      if (isNaN(newcredits2)){
       //alert ("Enter Quarter 2 Credits");
      } else {
       //alert (totalcc + " | " + totalac + " | " + newcredits1 + " | " + newcredits2);
       var newcredits_t2 = (newcredits1+newcredits2);
       var newpace2 = calculate_new_pace(totalcc,totalac,newcredits_t2);
       newpace2 = decimal_trunc(newpace2);
       $("input[name=pace_percent_result2]").val(newpace2);
      }
      if (isNaN(newcredits3)){
       //alert ("no credits entered: " + newcredits3);
      } else {
       var newcredits_t3 = (newcredits1+newcredits2+newcredits3)
       var newpace3 = calculate_new_pace(totalcc,totalac,newcredits_t3);
       newpace3 = decimal_trunc(newpace3);
       $("input[name=pace_percent_result3]").val(newpace3);
      }
      if (isNaN(newcredits4)){
       //alert ("no credits entered: " + newcredits4);
      } else {
       var newcredits_t4 = (newcredits1+newcredits2+newcredits3+newcredits4)
       var newpace4 = calculate_new_pace(totalcc,totalac,newcredits_t4);
       newpace4 = decimal_trunc(newpace4);
       $("input[name=pace_percent_result4]").val(newpace4);
      }
      if (isNaN(newcredits5)){
       //alert ("no credits entered: " + newcredits5);
      } else {
       var newcredits_t5 = (newcredits1+newcredits2+newcredits3+newcredits4+newcredits5)
       var newpace5 = calculate_new_pace(totalcc,totalac,newcredits_t5);
       newpace5 = decimal_trunc(newpace5);
       $("input[name=pace_percent_result5]").val(newpace5);
      }
      if (isNaN(newcredits6)){
       //alert ("no credits entered: " + newcredits6);
      } else {
       var newcredits_t6 = (newcredits1+newcredits2+newcredits3+newcredits4+newcredits5+newcredits6)
       var newpace6 = calculate_new_pace(totalcc,totalac,newcredits_t6);
       newpace6 = decimal_trunc(newpace6);
       $("input[name=pace_percent_result6]").val(newpace6);
      }

post a form
[7Replies]
- 04-Aug-2011 04:58 PM
- Forum: Using jQuery
I spent a good portion of the day struggling with this new (to me) jquery .post.

I have a web form (yeah) that I would like to have jquery direct the post and the form values to one of two php pages depending on the choice selected.

Ideal flow:

If a person selects radio button "email" and clicks submit send form values to page1

-Generate and send email and report success

-User never actually sees page1

If a person selects radio button "view" and clicks submit send form values to page2.

-Display page2
1. $(document).ready(function(){
  $("#listrequest_form").submit(function() {
    var labor_list = $("[name=labor_list]:checked").val();
    var labor_view = $("[name=labor_view]:checked").val();
    if(labor_view == 'view'){
     $.post("page1.php", {labor_list: labor_list, labor_view: labor_view});
    } else if(labor_view == 'email'){
     $.post("page2.php", {labor_list: labor_list, labor_view: labor_view});
    }
    return false;
  });
  });
2. <form name="listrequest_form" id="listrequest_form" action="" method="post">
          Select a list and to either view it on screen or to receive an email.</br><br/>
          <table>
          <tr>
           <td class="text">Child Care</td>
           <td class="text"><input name="labor_list" type="radio" value="childcare"/></td>
          </tr>
          <tr>
           <td class="text">Day Labor</td>
           <td class="text"><input name="labor_list" type="radio" value="daylabor"/></td>
          </tr>
          <tr>
           <td class="text">Tutor</td>
           <td class="text"><input name="labor_list" type="radio" value="tutor"/></td>
          </tr>
          <tr><td> </td></tr>
          <tr>
           <td class="text">Email</td>
           <td class="text"><input name="labor_view" type="radio" value="email"/></td>
          </tr>
          <tr>
           <td class="text">View</td>
           <td class="text"><input name="labor_view" type="radio" value="view"/><td>
          </tr>
          </table>
          <input type="submit" value="submit"/>
         </form>

undefined error
[3Replies]
- 26-Jul-2011 05:43 PM
- Forum: Using jQuery
Hi this is my first post, thus I hope I am in the right forum. when I load the forum I get an error on page that states permission denied.

My problem:

In jquery I am accessing a form field as follows:

if($("[name=jobs_type]:checked").val() == "neo"))

The page functions fine but it has the error on page message on the bottom left corner of the browser stating jobs_type is undefined.

jobs_type is the name assigned to 3 radio buttons.

Any help in solving the undefined is appreciated.

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend