Asked  7 Months ago    Answers:  5   Viewed   24 times

I want to change the form action based on a selection value.

<form name="store" id="store" method="post" action="">
<select name="storeID">
<option value="/stores/store6.php">6</option>
<option value="/stores/store10.php">10</option>
</select>                   
</form>

Now I want the form action, to use the select option value. For example:

If Selection 1 is selected, use the folowing form action /stores/store6.php

 Answers

22

You can use the onchange event to change the form's action

document.getElementById('store').storeID.onchange = function() {
    var newaction = this.value;
    document.getElementById('store').action = newaction;
};

Here is a jsfiddle with the code.

Wednesday, March 31, 2021
 
Powering
answered 7 Months ago
84

Your problem is the lack of AJAX to connect Javascript and PHP. The way your PHP script works is by manually running the script, so only the device hitting that script will see the notification. There is nothing that actually sends that info to your other device right now.

To better explain the problem, your desktop may have allowed access to the notifications, but it doesn't automatically pull in those notifications. The code you have provided will need to use AJAX to hit the script URL, instead of using it as a cron job.

First off, you need to start a repeating request to the PHP script to see if there has been any updated notification. If there is a new notification, then you need to create a new notification object using the returned response.

Second, you need to alter the PHP script to output a JSON string rather instead of the notification script.

JSON output example:

{
  {
    title: 'new blog!',
    options: {
      body: 'come read my new blog!',
      icon: 'same icon as before or maybe a new one!'
    }
  },
  {
    title: 'another blog item!',
    options: {
      body: 'come read my second blog!',
      icon: 'hooray for icons!'
    }
  }
}

Your notifyUsers() should take title and option as arguments instead of hardcoding them:

function notifyUser(title, options) { ... }

Using jQuery, get the PHP response and create the notification:

function checkNotifications(){
  $.get( "/path/to/script.php", function( data ) {
    // data is the returned response, let's parse the JSON string
    json = JSON.parse(data);

    // check if any items were returned
    if(!$.isEmptyObject(json)){
      // send each item to the notify function
      for(var i in json){
        notifyUser(json[i].title, json[i].options);
      }
    }
  });

  setTimeout(checkNotifications, 60000); // call once per minute
}

Now, you just need to kickstart the AJAX polling, so add this to your webpage:

$(document).ready(checkNotifications);

That's pretty much it! You were just missing the part when your desktop needed to pull in the notifications. Heads up though, this isn't tested and you may need to tweek something.

Wednesday, March 31, 2021
 
nighter
answered 7 Months ago
10
<select name="item[type]" id="selectBoxId">
<option value="0" class="dr">First</option>
<option value="1" class="dr">Second</option>
<option value="2" class="dr">Third</option>
<option value="3" class="dr">Fourth</option>
</select>


<script type="text/javascript">
    var test = "<?= $test; ?>";
    if (test != '' && parseInt(test)) {
        document.getElementById('selectBoxId').selectedIndex = test;
    }
</script>
Wednesday, March 31, 2021
 
ClmentM
answered 7 Months ago
85

I made a JSFiddle. I have removed loop autoplay from the video tags.

$("#myCarousel").carousel({
  interval: 4500
});

$("#myCarousel").on('slid.bs.carousel', function () {
   var vids = $(this).find(".active video");
   if(vids.length > 0){
      vids[0].pause();
      vids[0].currentTime = 0;
      vids[0].play();
   }
})
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>

<div id="myCarousel" class="carousel slide carousel-fade" data-ride="carousel">
<div class="carousel-inner">
    <div class="carousel-item active">
        <img src="">
    </div>
    <div class="carousel-item">
        <video id="myVideo" muted><source src="https://www.w3schools.com/html/mov_bbb.mp4"></video>
    </div>
    <div class="carousel-item">
        <video id="myVideo2" muted><source src="https://www.w3schools.com/html/mov_bbb.mp4"></video>
    </div>
</div>
</div>
Saturday, May 29, 2021
 
muaddhib
answered 5 Months ago
53
$("#selectsearch").change(function() {
  var action = $(this).val() == "people" ? "user" : "content";
  $("#search-form").attr("action", "/search/" + action);
});
Tuesday, June 1, 2021
 
Eugenie
answered 5 Months ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :