[jQuery] Re: Having a problems with $.post() and external .js files

[Dhruva Sagar]

In my opinion the problem of it not triggering the second time when your
.php file has loaded a new form is because it is a new .select tag!The not
triggering has nothing to do with including of the .js file.
What you need to ensure is after the $.post, when you update the form using

$('#searchbox').html(data);

you should at the same time actually be attaching the 'change' trigger to
the '.selector'

I hope you understand.

Here is how it should be done in my opinion :

function onSelectorChange() {

$("#loadingbox").show();

      var brand = $('#brand').val()
      var oldbrand = $('#oldbrand').val()
      var model = $('#model').val()
      var freegift = $('#freegift').val()
      var minutes = $('#minutes').val()
      var texts = $('#texts').val()
      var contractlength = $('#contractlength').val()
      var price = $('#price').val()
      var phoneprice = $('#phoneprice').val()

      var selectednetworks = [];
           $('@name=network:checked').each(function() {
             selectednetworks.push($(this).val());
           });

      $.post("searchformbox.php", {
'selectednetworks[]':selectednetworks, phoneprice: phoneprice, price:
price, brand: brand, model: model, freegift: freegift, minutes:
minutes,
texts: texts, contractlength: contractlength, oldbrand: oldbrand },
   onPost
}

$('.selector').change(onSelectorChange);

function onPost() {
     $("#searchbox").html(data);
     $('.selector').change(onSelectorChange);
}

I hope the syntax & the bracket '{', '}' are in correct order above.
But more importantly I hope you get the idea...

Thanks & Regards,
Dhruva Sagar.


Ted Turner <http://www.brainyquote.com/quotes/authors/t/ted_turner.html>  -
"Sports is like a war without the killing."

On Fri, Aug 21, 2009 at 2:52 PM, m...@polyvisual.co.uk <
m...@polyvisual.co.uk> wrote:

>
> Hi all,
>
> Can someone help? I'm having a problem with $.post() and including
> external .js files.
>
> I include my jquery in the header of each page:
>
> <script type="text/javascript" src="includes/common.js"></script>
>
> I have a php file which includes a form [an external php file called
> searchformbox.php]. Each time a <select><option> is changed in the
> form, jquery handles the submit by doing a $.post() and sending all
> the form variables back to searchformbox.php. The searchformbox.php
> with the new form options is reloaded its <div> by using .html()
>
> What I have found, is that if I don't re-include the external .js file
> in searchformbox.php, the jquery does not trigger the second time a
> <select><option> is changed.
>
> The answer [it seems] is to re-include the external .js file in
> searchformbox.php. However, this causes the jquery to be triggered
> twice (obviously causing twice the number of mysql queries and a GET
> to reload the common.js file).
>
> I [think I] understand why the jquery is triggered twice, but I can't
> understand how to stop it. It seems like a catch 22 problem... can
> anyone help?
>
> Thanks :)
>
> Here's the jquery I use for the form resubmit [each <select> has the
> class .selector]:
>
> $(".selector").change(function(){
>
>       $("#loadingbox").show();
>
>
>       var brand = $('#brand').val()
>       var oldbrand = $('#oldbrand').val()
>       var model = $('#model').val()
>       var freegift = $('#freegift').val()
>       var minutes = $('#minutes').val()
>       var texts = $('#texts').val()
>       var contractlength = $('#contractlength').val()
>       var price = $('#price').val()
>       var phoneprice = $('#phoneprice').val()
>
>       var selectednetworks = [];
>            $('@name=network:checked').each(function() {
>              selectednetworks.push($(this).val());
>            });
>
>       $.post("searchformbox.php", {
> 'selectednetworks[]':selectednetworks, phoneprice: phoneprice, price:
> price, brand: brand, model: model, freegift: freegift, minutes:
> minutes,
> texts: texts, contractlength: contractlength, oldbrand: oldbrand },
>
>       function(data){
>               $("#searchbox").html(data);
>       }
> );
>
> });