PHP jQuery trigger button on dom change

Question

I have this scenario: I have a simple php file with only few html elemnts: a div called switch, another called lamp and a couple of buttons. The two buttons are labeled On and Off. The lamp div is empty. The switch div is empty too, but is updated using jQuery and Ajax with the content of a txt file, that only contains one word: it could be On or Off. What i'm traying to achieve is this: whenever the file is updated with the word On or Off i would like the On or Off button to be triggered correspondingly and the lamp div to change the background color. Is it possible? UPDATE:

Example:

(function($){
  $(document).ready(function() {
  $.ajax({
    url : "testfile.txt",
    dataType: "text",
    success : function (data) {
       $("#switch").html(data);

       // this doesn't seems to work...
       var word = data.toLowerCase();
       $('#' + word).trigger('click');

        // this works 
        $(document).ajaxStop(function(e){
            var response = $("#switch").html();
            $("#" + response.toLowerCase()).trigger("click");
        });

        var $container = $("#switch");
        var refreshId = setInterval(function()
        {
            $container.load('testfile.txt').html();
        }, 2000);
      }
  });
}); 
})(jQuery);

<div id="switch"></div>
<div id="on" class="button">On</div>
<div id="off" class="button">Off</div>

<div id="lamp"></div>

When you say trigger, do you mean click, or a certain set of code is triggered? — AmmarCSE
– AmmarCSE, Commented May 18, 2015 at 9:20

AmmarCSE · Accepted Answer · 2015-05-18 09:18:59Z

1

Since the response is only one word. Why not try

var word = data.toLowerCase();
$('#' + word).trigger('click');

in the success callback.

answered May 18, 2015 at 9:18

AmmarCSE

30.7k6 gold badges48 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

uomopalese Over a year ago

Thanks, this only works if i refresh the page (after changed the content of the file), it doesn't update dinamically

AmmarCSE Over a year ago

@uomopalese, did you put this code in the ajax success callback? What do you mean dynamically? When the page first loads?

uomopalese Over a year ago

@AmmaCSE I updated the code to show you were I put it. I don't know why one works and the other doesn't.

iamawebgeek · Accepted Answer · 2015-05-18 09:34:53Z

0

If you have only one ajax request, you can do like this:

$(document).ajaxStop(function(e){
  var response = $("#switch").text();
  // do what you want with variable response here
  $("#" + response.toLowerCase()).trigger("click");
});

answered May 18, 2015 at 9:34

iamawebgeek

2,8951 gold badge22 silver badges35 bronze badges

Comments

adriann · Accepted Answer · 2015-05-18 10:24:16Z

0

Maybe this can help for what you need:

(function($){
    $(document).ready(function() {
        var $container = $("#switch");
        $container.load("testfile.txt", function() {
            setInterval(function() {
                $container.load("testfile.txt");
            }, 2000);
        });
    }); 
})(jQuery);

Use clearInterval() to stop the timer when needed.

answered May 18, 2015 at 10:24

adriann

4463 silver badges12 bronze badges

2 Comments

uomopalese Over a year ago

Where I have to put clearIntervall() ? The browser is sending cuntinuous requests to the server. Thanks

adriann Over a year ago

Your setInterval makes a request every 2s and updates the container as long as the page is loaded. This is how you can detect changes in the file. You can use clearInterval on some user action or when a certain condition is met.

Collectives™ on Stack Overflow

PHP jQuery trigger button on dom change

3 Answers 3

3 Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related