CODEWITHSUNDEEP
javascriptphphtmlbuttonisset
wuv1
wuv1

Reputation: 59

Check to see if a button is clicked on... not working

Just a very brief explanation of what a part of my code does:

WHAT I'M TRYING TO DO: I'm trying to check to see which button the user clicked on so that the appropriate code will be executed.

I've been looking around and pretty much everywhere I go, people are suggesting to use isset(), but it's not working for me. Perhaps I don't fully understand what isset() does, but doesn't it basically check to see whether a variable is set?

Here's my code:

<script>
    function show(x, y){
      
        <!-- Do something -->
      
    }
</script>


<form>
    <button name = "sButton" type = "button" onclick = 'show("searchForm", "insertForm");'>Perform Search</button>
    <button name = "iButton" type = "button" onclick = 'show("insertForm", "searchForm");'>Insert Data</button>
</form>


<form id = "searchForm" value "search" style = "display: none;" action = "test2.php" method = "post">

    <!-- Do something -->
  
</form>

<form id = "insertForm" style = "display: none;" action = "test2.php" method = "post">

    <!-- Do something -->
  
</form>

<!-- This is the test2.php page -->

if(isset($_POST['sButton'])){
			
    <!-- Do something -->

}
else{
			
    <!-- Do something -->

}

To test it, I had the if statement print "Checked" and the else print "Not checked". When I run my code, it prints "Not checked". What am I doing wrong and what should I be doing?

Thanks in advance!

Upvotes: 0

Views: 2186

Answers (4)

RobG
RobG

Reputation: 147423

I'm not sure what you're trying to do, but I don't see why the buttons are in a form at all. Consider attaching the listeners dynamically, adding a name or ID to the buttons so you can tell which one was clicked then hide or show the forms depending on which was clicked:

// The buttons don't seem to need to be in a form, so use some other
// container so you don't need to worry about a useless form being
// submitted
<div id="buttonContainer">
  <button id="searchButton">Perform search</button>
  <button id="insertButton">Insert data</button>
</div>

// Forms for testing
<form id="searchForm"><input value="search"></form>
<form id="insertForm"><input value="insert"></form>

and the code:

<script>

// Hide and show forms depending on which button was clicked using the
// button's ID
function showForm(event) {

  // If the search button was clicked, show the search form and hide the
  // input form
  if (/search/.test(this.id)) {
    document.getElementById('searchForm').style.display = '';
    document.getElementById('insertForm').style.display = 'none';

  // If the insert button was clicked, do the opposite
  } else {
    document.getElementById('searchForm').style.display = 'none';
    document.getElementById('insertForm').style.display = '';
  }
}

// Attach listeners to the buttons
window.onload = function() {
  Array.prototype.forEach.call(document.querySelectorAll('#searchButton, #insertButton'),
    function(button) {
      button.addEventListener('click', showForm, false);
    }
  );

  // Hide the forms
  Array.prototype.forEach.call(document.querySelectorAll('#searchForm, #insertForm'),
    function(form) {
      form.style.display = 'none';
    }
  );
}

</script>

Upvotes: 1

Pedro Lobito
Pedro Lobito

Reputation: 98961

Use this:

onclick = 'show(this.name, "searchForm", "insertForm");'

Example:

<button name = "sButton" type = "button" onclick = 'show(this.name, "searchForm", "insertForm");'>Perform Search</button>


function show(name, x, y){

    alert(name);

   if(name === "sButton"){
   do this....
   }
}

Output:

sButton

DEMO

http://codepen.io/tuga/pen/RPNaXY

Upvotes: 1

Federico Sosa
Federico Sosa

Reputation: 94

Add an 

<input type="hidden" name="sButton" />

into the search form, and a 

<input type="hidden" name="iButton" />

into the insert form.

After that. You need to submit the (selected) form in the show(...) javascript function

Upvotes: 1

user4765675
user4765675

Reputation:

You are not passing your buttons sButton or iButton into test2.php because your second and third form do not have them as input. Only inputs inside each particular form will be submitted. and your form that has the buttons has no action only the buttons call the JS function.

What I suggest you do is to add hidden fields for each form that you are submitting to test2.php as follows:

<form id = "searchForm" value "search" style = "display: none;" action = "test2.php" method = "post">
     <input  type="hidden" name = "sButton" value="sButton" />
    <!-- Do something -->

</form>

<form id = "insertForm" style = "display: none;" action = "test2.php" method = "post">
    <input  type="hidden" name = "iButton" value="iButton" />
    <!-- Do something -->

</form>

This way your test2.php should work.

Upvotes: 1

Related Questions