0

I am using jquery's ajax controls and the php files I am use dynamically create fields and dropdowns based on the information sent to the php file via get requests. The problem I am running into is that when php adds the form dynamically the dom is not updated to recognize the new dom elements.

Once the load request loads the dynamic data I need jquery to continue to manipulate these new fields, but jquery is not recognizing the new dom elements which makes the new dom elements like buttons static. and yes all the dynamic fields have their own unique id's/classes.

I have tried:

$("body").on("mouseover mouseout", "select", function(e){

$('#filelocations').change(function(){
var urlforcode = this.value;
var codeserial = encodeURIComponent(urlforcode);
$( "#containcontent" ).load("/include/adminarea.php?edittext="+codeserial);
});
 <-- generic base code, but it only works some of the time.

My Question is how do I have jquery interact with elements that do not exist on the initial page load but will allow me to manipulate that data when loaded dynamically through .load requests?

Simple PHP Switch : 

<?php


$statevariable = $_GET["stateSELECT"];

switch ($statevariable) {
case "AL":
echo '<p class="errorstyle margintopspacing" style="background:purple;       color:white;">Some Pricing Data</p><button id="pricingsystem" class="btn btn-primary" >Click To Start Pricing</button>';
break;
case "AK":
echo "Switch1 ".$_GET["stateSELECT"];
break;
case "AZ":
echo "Switch2 ".$_GET["stateSELECT"];
break;
default:
echo "Switch3 ".$_GET["stateSELECT"];
}



?>

Simple Jquery Event:

$('#pricingsystem').click(function(){
console.log('The Stuff');
});
Carlos Baez
  • 49
  • 1
  • 8
  • Look into delegated events http://learn.jquery.com/events/event-delegation/ – Rob Schmuecker Jul 30 '14 at 14:45
  • `on()` is the answer, so i guess you are using it incorrectly. Please give a specific example of an event listener you have that isnt working with dynmic content, along with an example of the dynamic html – Steve Jul 30 '14 at 14:45
  • @RobSchmuecker wouldn't that be handled by $(document).on ? as all elements would be children of the main dom. user574632 i figured that but was not sure where I was going wrong with the .on – Carlos Baez Jul 30 '14 at 14:57
  • Yes hence you need to do `$(document).on('click', '#pricingsystem', function(){...})` and if you're adding more than one element that's not gonna be correct as it's an `id` – Rob Schmuecker Jul 30 '14 at 15:00
  • @RobSchmuecker please add this code as answer. Once I saw the #pricingsystem for the data handler the heavens opened up haha. I will accept your answer, as I knew it was something stupidly simple! thanks! – Carlos Baez Jul 30 '14 at 15:06
  • @CarlosBaez don't stress. There's a tonne of these questions with answers already, all to do with dynamically added content and event delegation. – Rob Schmuecker Jul 30 '14 at 15:27
  • Having an issue with the .on event. As the code is working, it is firing the event multiple times. For example, if I click the button, it does not fire it just once, it fires it 3 or 4 times in one single click. Have you heard of this? – Carlos Baez Jul 30 '14 at 15:28
  • thanks! @RobSchmuecker also found the answer to the above here for multiple even firing weird that it does that : http://stackoverflow.com/questions/14969960/jquery-click-events-firing-multiple-times – Carlos Baez Jul 30 '14 at 15:31
  • If you add the delegated event just once outside of any functions other than `ready` then you'll not have that problem. – Rob Schmuecker Jul 30 '14 at 15:45

1 Answers1

0

Add a callback function that is executed when the file is loaded.

$( "#containcontent" ).load("/include/adminarea.php?edittext="+codeserial, function(){
    // Stuff that must be done when the file is loaded
});
Praind
  • 1,551
  • 1
  • 12
  • 25
  • That would work for this particular code, but not for elements that do not exist in the dom for example I updated the initial question with a switch statement that creates a button. I need jquery to fire that button for a load request to even trigger. – Carlos Baez Jul 30 '14 at 14:54