Form action execute if input value is equals to given value in javascript?

Question

Below is my HTML code of form where I used Form button outside the form and its working fine for me..and the value of my field is fetching from Mysql Like Status is Active, Passive or Dead what I am looking for is my form will execute only if the fetching input value equals to Passive or Dead Only Totally Don't Know What to Do.

<input type="submit" form="nameform" value="Admit Student" style="margin-right: 16px" name="admit" />
<form action="/student/create" method="get" id="nameform">
  <div class="row">
    <div class="col-sm-4">
      <div class="form-group" style="display:none;">
        <label>Current Status</label>
        <input type="text" value="<?php echo $enquiry_data['status']; ?>" name="status" class="form-control">
      </div>
    </div>
</form>

Thats why i use form="nameform" in submit field and its fetching the value and working fine... i am looking for only how to execute the form action according to the input field — Kapil Rao, Jan 27 '20 at 07:25
@mplungjan Seems so. Maybe he is using the `form` attribute to decide which form to submit on it's onclick, because I didn't find here https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/submit — nice_dev, Jan 27 '20 at 07:27
the given form is fetching details from the enquiry page where the status is active-passive or dead and the form is showing the current status.... what am m concern is if input status fetching field value is active then it will not execute the form for execution the person must change the status before clicking on the button — Kapil Rao, Jan 27 '20 at 07:37
Note: the `` tag does not use and does not need a closing slash in HTML and never has. — Rob, Jan 27 '20 at 12:38

score 0 · Answer 1 · answered Jan 27 '20 at 07:27

There are plenty of ways to do this, best would be, do not send form request via the form, use Javascript to validate on click of button, then send form data, something like this easiest way

var request = new XMLHttpRequest();
request.open("POST", "http://example.com/submitform.php");
request.send(formData);

score 0 · Answer 2 · answered Jan 27 '20 at 07:28

0

Something like this?

$("#nameform").on("submit",function(e) {
  const val = $("[name=status]").val().trim();
  console.log(val)
  if (val==="" || "Active" === val) e.preventDefault();
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="submit" form="nameform" value="Admit Student" style="margin-right: 16px" name="admit" />
<form action="/student/create" method="get" id="nameform">
  <div class="row">
    <div class="col-sm-4">
      <div class="form-group" style="display:none;">
        <label>Current Status</label>
        <input type="text" value="Active" name="status" class="form-control" />
      </div>
    </div>
  </div>  
</form>

answered Jan 27 '20 at 07:28

mplungjan

169,008
28
173
236

not working brother still executing the Active or active value fields looking to stop the active fetched value – Kapil Rao Jan 27 '20 at 07:44
As you can see the code I posted works here. If it does not work for you then you need to be clearer in your specification – mplungjan Jan 27 '20 at 08:10
Your code executes on form submission (user action) and the question is somewhat vague on exact point of when the code should execute. I think OP might want the thing to execute on value retrieval. – Zero Jan 27 '20 at 08:28

score 0 · Answer 3 · edited Jun 20 '20 at 09:12

If I got your question correctly, you will likely have to set/get that value through javascript on an event.

I assume what you want to do is: perform an action automatically the moment value is retrieved (if it fits your condition) and not on user action, such as button click.

Fetch your data into a javascript code. Following question answers might be helpful with that How do I pass variables and data from PHP to JavaScript?.
From that point enter those values into the form field. An answer to This question has info on how to do that.
If you get the values you want THEN trigger whatever action you want to trigger.

mplungjan's answer should work if you want to perform your actions on form submission (when the user clicks a button or something).

As a side note: if you clarify exactly what you expect to achieve (for example: is it something should execute automatically when the page loads OR do you just need to validate a value) you might get a more specific answer - perhaps even a better solution to your problem. If you only need validation then my solution is an overkill at this point.

Whilst this may theoretically answer the question, [it would be preferable](//meta.stackexchange.com/q/8259) to include the essential parts of the answer here, and provide the link for reference. — mplungjan, Jan 27 '20 at 08:30
@mplungjan I only remember the mechanism from theoretical side as I haven't touched anything website related in quite a few years. At the risk of sounding lazy, I'll leave the code side to more experienced people. — Zero, Jan 27 '20 at 08:45

score 0 · Accepted Answer · answered Jan 27 '20 at 10:00

Try this, using onsubmit="return validateForm()" on your form to validate your input field.

function validateForm() {
  var current_status = document.forms["nameform"]["status"].value;
  var default_value = ['passive', 'dead'];
  if (!default_value.includes(current_status)) {
    alert("You are not allowed to continue");
    return false;
  }
}

<input type="submit" form="nameform" value="Admit Student" style="margin-right: 16px" name="admit" />
<form action="/student/create" method="get" id="nameform" onsubmit="return validateForm()">
  <div class="row">
    <div class="col-sm-4">
      <div class="form-group" >
        <label>Current Status</label>
        <input type="text" value="" name="status" class="form-control">
      </div>
    </div>
</form>

Great Great Great Thanks Melvin you Resolved my Long Term Issue..... Thanks a Lot Again Have a Successful Life Brother... — Kapil Rao, Jan 27 '20 at 12:44

Form action execute if input value is equals to given value in javascript?

4 Answers4