2

//index.php

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script>
            $(function() {
                $('form.frm_details').on('submit', function(event) {
                    event.preventDefault();
                    $.ajax({
                        url: 'functions2.php',
                        type: 'post',
                        dataType: 'json',                       
                        data: $(this).serialize(),
                          success: function(data) {
                               if(data.status == '1')
                                {
                                    $('#info').addClass('alert alert-danger no-border').html(data.message);
                                } 
                               if(data.status == '2')
                                {
                                    $('#info').addClass('alert alert-danger no-border').html(data.message);
                                }                               
                            }  
                    });
                });
            });
        </script>

        <script>
        function get_page(){
           $.ajax({
           type: 'GET',
           url: '/domcontent.php',
           dataType: 'html'
          }).done(function( data ) {
          $('#get_page').html(data);
          });
        }   
        get_page();
        </script>


        outside the dom
        <form   name='frm_details' class='frm_details' id='frm_details0' action=''>
        <input type='text' name='fname'>
        <input type='text' name='lname'>
        <input type='submit' value='Outside dome'>
        </form>

        <div id='get_page'></div>

//domcontent.php

inside the dom
<form   name='frm_details' class='frm_details' id='frm_details1' action=''>
<input type='text' name='fname'>
<input type='text' name='lname'>
<input type='submit' value='inside dom'>
</form>

im running into an issue with the 2 pages above index.php and domcontent.php my end goal is to be able to submit forms from index.php and domcontent.php using the same piece of ajax code bare in mind these are both the same form one is new and the other is update

the issue is when submitting the form frm_details0 from index.php it sees the ajax and submits the form to functions2.php i can see this works via the chrome network developers tool but the form frm_details1 inside the dom loaded via ajax onto index.php doesn't submit or even access functions2.php how can i make the form loaded inside the dom on index.php submit using the ajax located on index.php

im new to ajax so where possible please show edits to my code

thanks in advance

Nathan
  • 509
  • 4
  • 12
  • Not sure i understand exactly what is your issue/expected behaviour but it looks like you want to bind `submit` event to `frm_details1` form which is added following first ajax request result: `$('#get_page').html(data);`. Is it? – A. Wolff Dec 15 '15 at 09:45
  • thats correct i wish to use the first ajax script to submit frm_details1 inside the dom – Nathan Dec 15 '15 at 09:46
  • So to delegate it, you can use: `$(document).on('submit', 'form.frm_details', function(event) {...});`. Bind event to `document` or to closest static common ancestor. This will handle both forms. And the dupe was relevant indeed – A. Wolff Dec 15 '15 at 09:48
  • thank you that's working perfectly – Nathan Dec 15 '15 at 09:49
  • This would help you i guess to get in touch regarding what is delegation: https://learn.jquery.com/events/event-delegation/ Just be aware that just bubbling events can be delegated, e.g, you cannot delegate `load/error/etc...` events (even in case of none bubbling event, you can still capture them on modern browsers, but that's an other story...) – A. Wolff Dec 15 '15 at 09:52
  • ill have a read thank you so much for taking 5 minutes of your time to help me ive been trying to resolve this for 2 weeks now with no luck – Nathan Dec 15 '15 at 09:54
  • Ya, sometimes we just need to see a concrete sample of what we need to 'get in touch'... :) – A. Wolff Dec 15 '15 at 09:55

0 Answers0