Checkbox input remains false on form submit - forms

I am trying to post a form and even though all the inputs map their value accordingly in the receiving controller-method , the bool-s of checkbox-es remain false.
What am i doing wrong ?
POCO
class MyPoco
{
public string User{get;set;}
public bool Require {get;set;}
}
Form
<form id="createForm" method="post" action="[some url]">
<input type="checkbox" id="require" name="Require" />
<input type="text" id="user" name="User"/>
</form>
Controller (method)
[HttpPost]
[Route("[some url]")]
public async Task<long> CreateAsync(MyPoco request)
{
}
Why in my case above does request.Require is always false.I have mapped them correctly (the name attribute).

The reason is that you forget to set value of checkbox:
<input type="checkbox" id="require" name="Require" value="true" />
If a checkbox is checked, then the postback values will contain a key-value pair of the form [InputName]=[InputValue]
If a checkbox is not checked, then the posted form contains no reference to the checkbox at all.

I see you are missing asp-for attribute for your checkbox input. Instead of name="Require", use asp-for="Require" as follows:
#model MyPoco
<input asp-for="Require" type="checkbox" id="require" />
If you don't want to use asp-for attribute then you have to use jQuery as follows:
$(document).on('change','#require',function() {
if ($(this).is(':checked')) {
$(this).val(true)
} else {
$(this).val(false)
}
});

Related

MVC how can i post a form without using a model

I would like to know how i could sumbit a form in mvc 4 without using a model binding to the view.
can some one please demontrate how? and how can i use that form in the controller?
It is very easy to use a form without any sort of Model binding.
Simple set up your for using either #using(Html.BeginForm()){ ... } or plain html.
<form id="myForm" action="/ControllerName/ActionName" method="Post">
<input type="text" name="foo" value="FOOOO" />
<input type="text" name="bar" value="Baaaar" />
<button type="submit">Submit</button>
</form>
When you post this to the ActionResult, your action result just needs to be set up to accept a string value named foo and one named bar
[HttpPost]
public ActionResult ActionName(string foo, string bar){
// your code here
return View();
}

MVC4 Pass Model from View to Controller

//Model
public class Car
{
string name{get;set;}
double speed {get;set;}
//etc.
}
Basic model
//Controller
public ActionResult ModifyCar(Car c)
{
c = GetAdditionalData(c.name, c.speed);
return View(c);
}
So I'm making call to outside service to get additional data for car.
Below is the form which I'm really confused on. I am just going to write this in HTML.
But from here I'd like to take a basic empty model.. populate it then send to the controller for additional data.
//View
#model Car
<form id="carform" method="post" action="/Car/ModifyCar"> //Guessing
<input id="carName" /> //Somehow bind with #model.name
<input id="carSpeed" /> //Somehow bind with #model.speed
<input type="submit" /> //Somehow send the model to the controller
</form>
Sorry I'm not really good at the View part at all but I hope you can see where I was going here.
Also, I'm doing validation that requires a form id.. I noticed that there is no form id when using HTML Helper to make the form. Thats going to break my CSS I wrote.
Any help would be greatly appreciated.
Thanks
Try this :
#model Car
<form id="carform" method="post" action="/Car/ModifyCar"> //Guessing
<input id="carName" name="carName" value=#Model.name /> //Somehow bind with #model.name
<input id="carSpeed" name="carSpeed" value=#Model.speed /> //Somehow bind with #model.speed
<input type="submit" value="Submit" /> //Somehow send the model to the controller
</form>
when your form will submit it will go to ModifyCar action in Car
Controller.
But as you has mentioned in your question that we cannot give id in html helper ,it is wrong we can for ex:
#using(Html.BeginForm("ModifyCar","Car",FormMethod.Post,new{ id="carform" }))
the above BeginForm() will render same html as:
<form id="carform" method="post" action="/Car/ModifyCar">

Adding an extra relative value to an input value field

I'm currently creating a form that is very similar to the following code.
<form name="test" action="/go/test" method="post">
<input type=hidden name="hotspot_url" value="http://www.test.com/">
<input name="cky" value="<%write(cky);%>" type="hidden">
<input name="accept" value="Accept" type="hidden">
<input name="saccept" size="20" value="I Accept" onClick="hotspot.accept.value='Accept'" type="submit">
<input name="sdisconnect" size="20" value="I Decline" onClick="hotspot.accept.value='Decline'" type="submit">
</form>
However, the new form has a text input field. What I want to achieve is that the value entered in that text field is placed, upon send, after the test.com value (location marked with xxx)
<input type=hidden name="hotspot_url" value="http://www.test.com/xxx">
I've looked around - but i can't seem to find a solution.
What would be the best way to get this done?
You can use a buttons onclick event, which is not of type submit. When onclick occurs, you can first change the value of hidden field and then submit the form.
Or if you use JQuery, you can use the following jQuery code to do something before the form is submitted:
$(function() {
$('#form').submit(function() {
// DO STUFF
return true; // return false to cancel form action
});
});
You can give both inputs an id, and do something like this:
give the form an "onsumbit= doThis()"
function doThis(){
var hiddeninput= $('#hiddeninput').val();
var input = $('#input').val();
$('#hiddeninput').val(hiddeninput+input);
return true;
}
this is very simple nothing fancy.

How do I save multiple fieldsets using the play framework form tag?

I have multiple fieldsets containing radiobuttons and an input box on a page. I was given this app to maintain and currently the data is saved by iterating over a Scope.Params parameter, picking out each value, using params.get() and passing them along to a method to save.
What is a good way to execute this? Will I always have to use a Scope.Params parameter? I know one can parameterize the values of the input fields of the form in the action that is called upon submit. How do I do it for a fieldset?
Thanks.
In controllers you can automatically get parameters if you have in your method signature.
Let's say you have a from createUser.html calls a POST method in your template. It is in UserController and createUser.
In form you have:
First name: <input type="text" name="firstname" /><br />
Last name: <input type="text" name="lastname" />
<input type="radio" name="gender" value="male" /> Male<br />
<input type="radio" name="gender" value="female" /> Female
so in you controller if you have a method like this:
pulic statid void createUser(String firstname, String lastname, int gender) {
User user = new User(firstname, lastname, gender);
...
}
So you don't necessarily need to get parameters separately.
EDIT -> In order to save multi-fields for same for you could use arrays like:
in form you could have: <input type="text" name="firstname[]" />
in controller:
pulic statid void createUser(String[] firstname ...) {
for (int i=0; i<firstname.length; i++) {
...
}
...
}

Dynamically adding form elements with jQuery and Zend_Form

I have a form in which people shall be able to add the same portion of elements with a plus-button, so that something like this is produced:
<div id="person-1" class="person">
<input type="text" name="name-1" id="name-1" />
<input type="text" name="age-1" id="age-1" />
</div>
<!-- as of here, it's JS created -->
<div id="person-2" class="person">
<input type="text" name="name-2" id="name-2" />
<input type="text" name="age-2" id="age-2" />
</div>
<div id="person-3" class="person">
<input type="text" name="name-3" id="name-3" />
<input type="text" name="age-3" id="age-3" />
</div>
I already managed to write jquery-code that allows me to add the same elements once again with a new id (name-1, age-1, name-2, age-2, name-3, age-3, …).
Of course, Zend_Form does not know about name-2 and name-3, so it just drops them when the form contains an error and is displayed again. Neither can I access the value of name-2 with $form->getValue('name-2'). I have to go over raw $this->getRequest()->getPost().
Is there a better method I can use to combine Zend_Form and javascript-based added form elements (of same type like an hardcoded element).
Caveat: In the real problem, it’s select and not input. Found out this could make a difference (with ->setIsArray(true)), but using select would blow up the example code.
What you could do is create a subform container inside your main form and add an X amount of subforms to that container.
For example:
class My_Form extends Zend_Form
{
private $_numPersons = 1;
public function setNumPersons($numPersons)
{
$this->_numPersons = (int) $numPersons;
}
public function init()
{
$container = new Zend_Form_SubForm();
$this->addSubForm($container, 'persons');
for($index = 0; $index < $this->_numPersons; $index++) {
$personForm = new My_PersonForm();
$container->addSubForm($personForm, $index+1);
}
}
}
When rendered, the input fields will have names like persons[1][name]. Note the $index+1, Zend_Form does not allow a form to be named '0'.
Ofcourse, you should only use this method if the amount of person subforms is limited.
Another strategy would be to override the isValid method and use a single My_PersonForm form to validate all the person data.
Sidenote; the above code will only work when you define the numPersons as part of the options set, when creating the form instance. E.g.;
$form = new My_Form(array('numPersons' => 10));