jQuery Forum

issue re-opening a div tag after closing
[4Replies]
- 24-Mar-2016 07:45 PM
- Forum: Getting Started
Hello,
Problem: reopening a a div tag via button.

initial page load, the div tag is hidden by design, this works.
User needs to change location information so he/she clicks the button(buttonONE) to open the div tag to make changes, this works.
after the changes are made the user clicks the button(buttonTWO) to save the information and the div tag is closed at the same time, this also works.

If a user decides to reopen the div tag using buttonONE (original button to open the div tag) the div tag remains closed.

initial call to this script opens the div tag but if its closed by another script such as the sec. set of script i copy/pasted at the bottom this script stops working or not making the call.
2. $(document).ready(function(){
3. $("#btl_showLocationChangeID").click(function(){
4. $("#locationDivID").show("slow");
5. });
6. });
so this script reloads a div tag to update information and hides the div tag a opened by the above script
2. $(document).ready(function() {
3. $('#btl_changeLocationID').on('click', function() {
4. var url = 'index2.php';
5. $('#div1-wrapper').load(url + ' #div1');
6. $("#locationDivID").hide();
7. });
8. });
Any ideas as to how i can resolve this issue?

Script wroks in Chrome but not in firefox or IE
[3Replies]
- 17-Oct-2015 09:09 PM
- Forum: Using jQuery
Hello,

I found a script that basically helps with a bootstrap dialog box which in my case is turned into a sign-in dialog box. as of now the dialog box disappears when i click the button btn_login

The code actually works but it only works in Chrome(version: 46.0.2490.71 m) but not in Firefox(version: 41.0.2) or in IE(version: 11.0.22),

I striped the code down to its minimum to troubleshoot and tested again and it still works but only in Chrome

I cleared the cash just to make sure nothing was interfering and still not working.

see code below.
any help or suggestion you can provide would be greatly appreciated.
thanks.
1. $(function() {
  $("button#btn_login").click(function(){
      event.preventDefault();
      var emailV = $( "#txt_IDemail" ).val();
      var pwdV = $( "#txt_IDpwd" ).val();
      if(emailV =="" || pwdV =="" ){
          $("#msgDisplay").html("Email address or password fields cannot be empty");
      }
      else{
          $("#msgDisplay").html("works");
      }
      return false;
  });
  });

Ajax not returning value back to the calling script
[4Replies]
- 26-Sep-2015 05:13 PM
- Forum: Using jQuery
Hello,
After 5 days of picking at the code I excepted defeat and come seeking help..lol

Working on a user registration form and in it i have 2 dropdown list, one for country and one for state/province.

On page load the country dropdown list is loaded and it works.

When a user selects a country the state/province dropdown list successfully loaded and this also works.

Not working:

in the event the user submits the form I like to have the states/province reloaded with the initial selection at the top of the menu list. As of now i cant even reload the state/prv dropdown list if the user hits the submit button.

any help you can provide would be greatly appreciated.

tk
1. <label>Select province (required field)</label><br/>
2. <select name="sel_Iprovince" id="IprovinceID">
3. <option value="">Select Province</option>
4. <?php
5. if (!empty($_POST['sel_Iprovince'])){
6. echo "<script> getProvince('" . $_POST['sel_Icountry'] . "', '" . $_POST['sel_Iprovince']. "'); </script>";
7. }
8. ?>
9. </select>
1. function getProvince(countryVal, provinceId) {
2. var GeoCountry = countryVal;
3. var GeoProvince = provinceId;
4. alert('test1=:'+GeoCountry+' '+ GeoProvince);
5. $.ajax({
6. type: "POST",
7. url: "get_tprovince.php",
8. data: {'GeocountryID': GeoCountry, 'GeoprovinceID': GeoProvince},
9. success: function(data){
10. if(typeof(GeoCountry) !== 'undefined'){
11. alert('test2=:'+ data);
12. $("#IprovinceID").html(data);
13. }
14. if(typeof(GeoProvince) !== 'undefined'){
15. alert('test3=:'+ data);
16. $("#IprovinceID").html(data);
17. }
18. }
19. });
20. }

form refresh, if statement not meeting condition
[3Replies]
- 19-Jul-2014 08:53 PM
- Forum: Using jQuery
Hello,
this is regarding form submitting without refreshing the page.

I think i isolated the problem (i think) but not sure how to go about fix or handle the problem.

I highlighted the problem area in red. the msg and "saved" conditions are not being met.

after some troubleshooting and searching i learned the value returned is a object and therefore it will never meet the if statement condition.

the value returned in msg is "saved" confirmed by the alert stage4 but its not equaling msg == 'saved'. its bypassing the if statement.

added debug screenshot.

how do i go about fixing this problem?
2. { alert('stage2');
3. $.ajax(
4. { type: 'POST',
5. url: "emailposter.php",
6. data: $('#emailForm1').serialize(),
7. success: function(returned_data)
8. { console.log(returned_data['msg']);
9. if(msg == "saved")
10. { $('.emailSuccess').fadeIn(200).show();
11. $('.emailError').fadeOut(200).hide();
12. $("#txt_email").val("");
13. alert('stage3(worked)' + ' ' + msg);
14. }
15. alert('stage4(content of msg)-->: '+' ' + msg);
16. },
19. -----------------------------------------
20. external php file
22. if(!empty($_POST['txt_email']))
23. { echo 'saved';}
24. else
25. { echo 'Not Saved';}

Trying to prevent the script from getting submitted at page load
[6Replies]
- 01-Jun-2014 11:09 AM
- Forum: Using jQuery
My script seem to execute with the page load so i added e.preventDefault() hoping it would stop the page from loading but its not working.. any ideas as to what im doing wrong?
1. <script src="http://code.jquery.com/jquery-latest.js"></script>
          <script>
              $(function()
              {    $("#send").click(function(e)
                  {    e.preventDefault();
                      e.unbind();
                      $.ajax(
                      {    type: "POST",
                          url: "data1.php",
                          data: $("#myform").serialize(),
                          success: function(response)
                          {    if(response == "done")
                              { $('.success').fadeOut(200).show();    }
                              else
                              {    $('.error').fadeOut(200).show();    }
                          },
                          error:function(response){    alert(response);    }
                      });
                  });
  
              });
          </script>
      </head>
      <body>
          <form id="myform">
              Name: <br /><input type="text" name="name" id="name" /><span class='success'>DB updated</span><br />
              Email: <br /><input type="text" name="email" id="email" /> <br />
              Message: <br /><textarea name="msg" id="msg"></textarea> <br />
              <input type="button" id="send" value="Submit" />
          </form>
  </body>
  </html>

datepicker, click event
[3Replies]
- 01-Apr-2014 10:56 PM
- Forum: Using jQuery
Hello,
I have the code below (datepicker) which works if its within the same file but if its pulled in from an external js file its wont work. My strength isn't in Jquery or javascript and I'm hoping someone here can help. I have a feeling it has something to do with the click event but not sure how to implement the event.
1. $(function()
  {    $("#datepicker").datepicker
      ({ showButtonPanel: true,
          minDate: '0M',
          maxDate: '+90D',
          dateFormat: 'yy-mm-dd',
          showButtonPanel: false
      });
  
      $( "#datepicker" ).change(function()
      {    var myDate = new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
          var the_date = $('#sb_datepicker').val();
          document.getElementById('time').value = myDate;
      });
  });

script that services multiple input fields
[1Reply]
- 07-Mar-2014 09:16 PM
- Forum: Using jQuery
Hello,

I have several input fields that only allow Alphabets & no space. I also have the code below which services that need but would have to copy / past the code for each individual field for it to work. is there a better way to use the code below and have selected input fields reference the same code?
1. ```
$(function() { $('input[name="fname"]').bind('keypress', function (event) { var regex = new RegExp("^[a-zA-Z]+$"); var key = String.fromCharCode (!event.charCode ? event.which : event.charCode); if (!regex.test(key)) { event.preventDefault(); return false; } }); });
```

Placement of jQuery script issue - not working from external file
[2Replies]
- 21-Feb-2014 02:12 PM
- Forum: Using jQuery
Hello,
I have a script that restricts user input and this works.
Problem area.
I have a external file that i keep the js in and for some reason the script wont work from the external file.. I also noticed that this particular script needs to be below the input field in order for it to work.
I like to keep the script in there respective files can this not be done with this particular jQuery script?

side note the jQuery test which is lso found in the external file, work
1. <!DOCTYPE html>
  <html>
      <head>
          <title> Testing field controls </title>
          <script src="http://code.jquery.com/jquery-latest.js"> </script>
          <script src="testjs.js" type="text/javascript"></script>
          <script>
              if (jQuery) { alert('jQuery is loaded!'); }
          </script>
      </head>
  <body>
      Firstname: <br />
      <input type="text" name="fname" id="fname" /> <br /><br />
2. 
  </body>
  </html>
testjs.js
1.     $('#fname').bind('keypress', function (event) {
          var regex = new RegExp("^[a-zA-Z]+$");
          var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
          if (!regex.test(key)) {
             event.preventDefault();
             return false;
          }
      });
2. if (jQuery) { alert('jQuery is loaded!'); }

submiting a form without reloading the page
[1Reply]
- 05-Feb-2014 09:18 PM
- Forum: Using jQuery
Hello,

I'm working on a email form which seems to work halfway and it doesn't seem to complete the process.
WHen i click the submit button I can see that the values appear in the url but it should return a success/failed message but with my script nothing happens..

any ideas as to how to fix this?
1. <!doctype html>
  <html>
      <head>
          <title>Submit form without refreshing the page</title>
          <script src="http://code.jquery.com/jquery-latest.js"></script>
          <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" </script>
          <script>
              $(function()
              {    $("#send").click(function()
                  {    $.ajax(
                      {    type: "POST",
                          url: "send.php",
                          data: $("#myform").serialize(),
                          cache: false,
                          success: function(response)
                          {    if(response == "done")
                              {    alert("Form submitted successfully!");    }
                              else
                              {    alert("Form submission failed!");    }
                          },
                          error:function(response){    alert(response);    }
                      });
                  });
              });
          </script>
      </head>
      <body>
          <form id="myform" >
              Name: <br /><input type="text" name="name" id="name" /><br />
              Email: <br /><input type="text" name="email" id="email" /> <br />
              Message: <br /><textarea name="msg" id="msg"></textarea> <br />
              <input type="submit" id="send" name="send" value="Submit" />
          </form>
      </body>
  </html>
1. <?php
  $name = $_POST['name'];
  $email = $_POST['email'];
  $msg = $_POST['msg'];
  print_r($_POST);
  
  if(!empty($name) && !empty($msg))
  { echo "done"; }
  else
  { echo "fail"; }
  ?>

works in FireFox, Chrome but not in IE7 or 10
[1Reply]
- 13-May-2013 09:26 PM
- Forum: Using jQuery
Hello everybody,

totally lost why this simple script wont work in IE 7 ro in IE10, any help you can provide would be greatly appreciated.
1. <!DOCTYPE>
  <html>
      <head>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
          <script src="http://code.jquery.com/jquery-latest.js"></script>
  
           <script>
              $(document).ready(function() {
                  $('#btn_click').on('click', function() {
                      var url = 'testingv2.php';
                      $('#div1-wrapper').load(url + ' #div1');
                  });
             });
           </script>
      </head>
  
      <body>
  
          <br />
          <div id="div1-wrapper">
              <div id="div1" style="border:solid 2px red; width: 100px;">
                  <?php echo rand(10,100); ?>
              </div>
          </div>
  
          <br />
          <div id="div2" style="border:solid 2px green; width: 100px;">
              <button type="button" id="btn_click" value="click me!" /> click me! </button>
          </div>
      </body>
  </html>

Response title

Attachments

jQuery Forum

Activity Trend