简体   繁体   中英

Form Submission issue, how I can get value of ID at end of my URL?

I have following code and I want to submit my Form on click button, Click function is working fine but tell me how I can Assign values of "ID" at the end of my URL as mentioned on the below code.

  <script type="text/javascript">
    $(document).ready(function() {
    $(".btn-success").click(function(){
    var ID = $(this).prev('.sendEmail').attr('id');
        alert(ID);
    });
    });
    </script>


    <script type="text/javascript">
    $(document).ready(function() {
      var form = $('#form2'); // contact form
      var submit = $('#submit2');  // submit button
      var alert = $('.alert'); // alert div for show alert message




      // form submit event
      form.on('submit', function(e) {
        e.preventDefault(); // prevent default form submit

        $.ajax({
          url: '//mydomain.com/'+ID, 
          type: 'POST', // form submit method get/post
          dataType: 'html', // request type html/json/xml
          data: form.serialize(), // serialize form data 
          beforeSend: function() {
            alert.fadeOut();
            submit.html('Sending....'); // change submit button text
          },
          success: function(data) {
            alert.html(data).fadeIn(); // fade in response data
            form.trigger('reset'); // reset form
            submit.html('&#10004; Alert Successfully Sent!'); // reset submit button text
          },
          error: function(e) {
            console.log(e)
          }
        });
      });
    });
    </script>

You need to make the ID var global:

var ID;
$(document).ready(function() {
    $(".btn-success").click(function(){
        ID = $(this).prev('.sendEmail').attr('id');
        alert(ID);
    });
});

...rest of your code

Or if you combine your document ready calls:

$(document).ready(function() {
    var ID;
    $(".btn-success").click(function(){
        ID = $(this).prev('.sendEmail').attr('id');
        alert(ID);
    });

   var form = $('#form2'); // contact form
   var submit = $('#submit2');  // submit button
   var alert = $('.alert'); // alert div for show alert message

   form.on('submit', function(e) {
    e.preventDefault(); // prevent default form submit

    $.ajax({
      url: '//mydomain.com/'+ID, 
      type: 'POST', // form submit method get/post
      dataType: 'html', // request type html/json/xml
      data: form.serialize(), // serialize form data 
      beforeSend: function() {
        alert.fadeOut();
        submit.html('Sending....'); // change submit button text
      },
      success: function(data) {
        alert.html(data).fadeIn(); // fade in response data
        form.trigger('reset'); // reset form
        submit.html('&#10004; Alert Successfully Sent!'); // reset submit button text
      },
      error: function(e) {
        console.log(e)
      }
    });
  });
});

This may help you understand more about variable scope

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM