Enable fields from the completion of a previous field

Asked

Viewed 980 times

1

I need to make a form that, to enable a field is required to fill in a previous field.

Since there will be a pagination between a question and another (next or previous).

You can do it in Ajax?

I’m using PHP and I think this can be done with AJAX or Jquery, but I don’t know how to do it.

jquery ajax
  • 2

    you can use the attribute disabled in fields with the function attr jQuery to enable fields whenever they exchange data... $("#nome").change(function() { if($(this).val().length > 0) { $("#nascimento").removeAttr("disabled"); } });

  • Thanks Leonardo although they do not like to be thanked in this were. rs <br> I have no knowledge in jquery and ajax but I will get. I didn’t express myself well, but I will use select and/or radio buttom. Would you have any tutorial? Thanks.

  • Hello @fabricio_wm have some very easy examples here: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_input_disabled

  • About jQuery, this site helps a lot, has the complete reference and several examples: http://api.jquery.com/removeattr/

  • As for the select and radio button, I believe you will not have problems with them, the disabled attribute works with these too

  • Leonardo. It worked with input, but I want to enable a link with button appearance (use bootstrap). have any hints? Thanks.

  • I feel like I’m almost there. I did so: <label class="radio"><input name="active" type="radio" class="form_1" value="S" onclick="if(Document.getElementById('title').disabled==true){Document.getElementById('title'). disabled=false}"/>Yes</label> <label class="radio"><input name="active" type="radio" class="form_1" value="N" onclick="if(Document.getElementById('title').disabled=true){Document.getElementById('title'). disabled=false}"/>No</label> <button>

  • When I click, load the same page.

  • Let us continue this Discussion in chat.

  • you can do the following: <button class="" onclick="javascirpt:Document.Location = 'yourlink.php'" />

  • It’s the same thing. I click on the radio button and enable the button and when I click, load the same page changing from http://localhost/Dashboard/questionario_posvenda/teste.php? active=N to http://localhost/Dashboard/questionario_posvenda/teste.php? active=S

  • I got it some other way. <button id="title" disabled="disabled" class="btn btn-Primary pull-right"><a href=".. /.. /Dashboard/questionario_posvenda/alert1.php">teste</a></button>

  • I thought it worked, but it didn’t work. So, in addition to changing the font color, the link loads even if you click the disabled button.

  • I got it. put the button with type="Ubmit and in the form I put the action by passing the link from the next page. Thanks.

  • 1

    <form action="test.php" method="post"> <select> <option name="active" value="-" onclick="if(Document.getElementById('advance'). disabled==false){Document.getElementById('advance'). disabled=true}"/> --</option> <option name="active" value="FUNCIONARIO1" onclick="if(Document.getElementById('advance'). disabled=true{Document.getElementById('advance'). disabled=false}"/>EMPLOYEE 1</option> < <button id="forward" type="Submit" disabled="disabled" class="btn btn-Primary pull-right" >Forward</button> </form> @Leonardobosquett Can you help me? select bad

  • could open a new question? we are running away from this context and code in comments will complicate our life :)

  • I’m already opening. Thank you.

Show 12 more comments

2 answers

1


I made an example in Jsfiddle here, used Bootstrap and jQuery, I have numbered the steps with the date-step attribute, and the required field(s) (s) attribute 'required';

  • Jquery

Thus the 'Prev' and 'next' functions related to 'data-next' and 'data-Prev' (attribute);

Validation and call in the 'next' function, passing the active step and validating.

Validation should be done in PHP !

  • Thank you @Luizz.

0

With or without Bootstrap what I usually do in this type of forms is to do everything on the same page, using only PHP.

And with the onChange change the form action.

<form action="">
...
   //mudando de página
   <input name="input1" onChange="this.form.action='novaPagina.php'">

   //se pretender ficar na mesma página
   <input name="input2">

   <?php
   if (isset($_POST['input2']))
   {
       //verificação que pretender, como por exemplo adicionar um campo:
       echo "<input name='input3'>";
       ...
       //ou preencher um campo 
   }
   ?>
...
</form>

If it’s not clarified tomorrow I’ll improve the answer.

Browser other questions tagged jquery ajax

You are not signed in. Login or sign up in order to post.