Double CheckBox Creation mistake? - asp.net-mvc

I have a foreach wich populates a table and one field of the line tables is:
<% foreach (var item in Model.List){%>
<td align="center">
<%: Html.CheckBox(item.ID.ToString(),item.isChecked)%>
</td>
<%}%>
Inside my post function I was trying to get the Request.Form["45"]( 45 is a sample ID) and saw that the value "true,false" was being recieved.
Taking a look into the Code generated, I just saw that:
<input name="45" type="checkbox" value="true" /><input name="45" type="hidden" value="false" />
How its possible since Im just asking to generate one input? I dont know too if Html.CheckBoxForis better to use in this case
Thanks !

You can read the explanation here
the same approach that both Ruby on Rails and MonoRail use.
When you submit a form with a checkbox, the value is only posted if
the checkbox is checked. So, if you leave the checkbox unchecked then
nothing will be sent to the server when in many situations you would
want false to be sent instead. As the hidden input has the same name
as the checkbox, then if the checkbox is unchecked you'll still get a
'false' sent to the server. When the checkbox is checked, the
ModelBinder will automatically take care of extracting the 'true' from
the 'true,false'
Why don't you use model so that model take care of it. Using request object is not recommended in asp.net-mvc You may also use formcollection parameter in your actionresult and handle this scenario using this approach.
You may always use html tags if helpers don't fit in your requirement.

Related

Is ASP.NET MVC's Checkbox Implementation Accessible / Screen Reader-Friendly?

If you've ever looked at what ASP.NET MVC actually renders when you use #Html.CheckBoxFor, then you've seen that each checkbox you request to be rendered actually results in the emission of not one but two input tags. One is the "true" value checkbox, and the other is for "false." The latter input is of type "hidden".
Generally this doesn't cause problems if you're using ASP.NET MVC correctly. You wouldn't notice the input doubling unless you tried to, for example, do something directly with Request.Form(e.g. Why does ASP.NET MVC Html.CheckBox output two INPUTs with the same name?)
My question, though, is how screen readers deal with this. For example, can they be relied upon to correctly report only the visible checkbox to the site user?
Screen readers will ignore hidden inputs.
Given the example you cite in your comment, it returns this code:
<div class="col pure-u-xl-1-3 pure-u-lg-1-3 pure-u-md-1 pure-u-sm-1 pure-u-xs-1">
<label>Home Club Newsletter</label>
<input checked="checked" … id="newsletter" name="JoinHomeClub" type="checkbox" value="true">
<input name="JoinHomeClub" type="hidden" value="false">
<span class="checkbox-label">Yes, please sign me Up!</span>
</div>
Right off the bat there is a problem here because the <label> is not associated with the control, and the visible text that is next to the checkbox is not associated with the field.
When I access the field in NVDA, all it says is "checkbox checked". There is no accessible name at all.
But to your question…
Your question was related to the <input type="hidden">. As #SLaks said, screen readers ignore <input type="hidden">. The fact that they have the same name value is no problem. If they had the same id value, then you would have a problem (how it would manifest in a screen reader depends on things and stuff).

Why doesn't TextBoxFor include validation elements if called twice for the same model property?

Simple question... Here is an example of some razor code:
#Html.TextBoxFor(c => c.RevisedEstimate)
#Html.TextBoxFor(c => c.RevisedEstimate)
Here is how this renders:
<input data-val="true" data-val-number="The field Revised Estimate must be a number." id="RevisedEstimate" name="RevisedEstimate" type="text" value="0" />
<input id="RevisedEstimate" name="RevisedEstimate" type="text" value="0" />
The obvious question you ask is, "Why are you doing that?". The razor view is actually building client side detail-row templates that are used in KendoUI grids. There are two similar grids and we use the same viewmodel server side. We actually do provide the id element for the template so each field in each row ends up with a unique id.
Why does the second input element not have the data-val and data-val-number elements?
Off the top of my head knowing what the JS does in the background, it seems to do this to prevent conflicts. The JS looks for the elements with the data- attributes to do it's validation, along with other functions, so it could possibly pick the wrong one if there are multiple instances of it.
since we were generating HTML for use in a client side template what we did was just create a variable to hold the HTML generated by the helper, and then render out that code in the Views..
Something like:
#{
var revisedEstimateInput = Html.TextBoxFor(c => c.RevisedEstimate)
}
Then later in the view:
#(revisedEstimateInput)
...in as many places as needed. This way the validation and other metadata attributes were in place in our client templates and all the kenodUI validation worked correctly.

How can I make my own check box in MVC?

I would love to use the:
Html.EditorFor(model => #Data.Test.Correct)
To create a checkbox.
However the source of my data is different from the data that needs to be updated. I know this may sound confusing but I get my data from a LINQ select query and then need to update in a different place.
The only way around this seems for me to hand code the HTML for the checkbox. But can someone give me an example of how I do this. For example, how can I code in the setting of checked=true?
You may write HTML codes like below to create a selected or unselected checkbox
<input type="checkbox" name="option1" value="1" checked="checked" />
<input type="checkbox" name="option2" value="2" />
But you will need to write additional code manually to determine which checkbox should be selected, if your checkbox is dynamic generated or being filled in with stored data.

Html.Hidden builds wrong value data in MVC 2 app

I am using an id value that I pass in a hidden field. When the user submits the form I need the hidden field for my update. After the update, a new value is placed in the hidden field in the model and sent back to the view. What seems so strange is the helper always uses the first value, never updates. For example, look at the following from the View:
<%: Html.Hidden("MyId",Model.MyId) %>
<%: Model.MyId %>
First time in a look at the source in the browser yields:
<input type="hidden" id="MyId" name="MyId" value="1" />
1
** submit back to controller and model updates the MyId property to 2.
Back at the browser I now find:
<input type="hidden" id="MyId" name="MyId" value="1" />
2
The very same model property has different values! The helper method is somehow grabbing it from a prior model instance or something?
Any help greatly appreciated on what I am not understanding. BTW..get the same behavior with Html.TextBox and Html.TextBoxFor.
Thanks.
That's how HTML helpers work and it's by design. When binding they will first look at the value in the GET/POST request to see if the value is present and after that in the model. If a value is found in the request they will simply ignore the value you set in the model.
Normally you are not supposed to modify the data sent in the request inside your controller action. But if anyhow you decide to do it you will need to either roll your own helper or simply:
<input type="hidden" name="MyId" value="<%= Model.MyId %>" />

How do I change the records being displayed on the page with buttons on the page (RoR)

I have a rails app that shows statistics based on an employee's daily production. currently my page shows ALL records.
I know how to show various different combinations such as records made between two dates etc... but what I really would like to do is make it so that single page (say the index page) has 3 controls that allow for it to switch between daily statistic records, weekly statistic records and a custom date constraint of statistic records (such as from date xx/xx/2009 to date xx/xx/2010). I have been searching for a while to attempt to figure this out but I am obviously missing something as I cannot find anyone else who has run into the same issues.
If this is too difficult to do this way, the other - mostly easy way I can see to do this is to create a page for each view, however it still leaves a question on how I set up the control to choose the custom date constraints.
I aplogise in advance for my newbyness but if someone could explain this to me, I think it is going to really increase my understanding of rails. Thanks in advance
Your control can easily append some information to the query string. Like this form does:
<form action="" method="get">
<fieldset>
<button type="submit" name="show" value="daily">Daily stats</button>
<button type="submit" name="show" value="weekly">Weekly stats</button>
</fieldset>
<fieldset>
From <input type="text" name="interval-start" value="" /> till
<input type="text" name="interval-end" value="" />
<button type="submit" name="show" value="interval">Stats for the specified interval</button>
</fieldset>
</form>
When user clicks on some button, browser sends all form fields to the server-side. On the server-side, in your action, you can check for the show property of the params array. Like this:
#reports = case params["show"]
when "daily"
#Just an example. Use ActiveRecord's query interface or Arel in Rails 3, not plain queries
Report.find_by_sql "SELECT * FROM reports WHERE DATE(report_date) = DATE(NOW())"
when "weekly"
Report.find_by_sql "SELECT * FROM reports WHERE WEEK(report_date) = WEEK(NOW())"
when "interval"
Report.find_by_sql "..."
else
#Some other possible values, filters, so on
end
And in your view just output the #report variable as usual.
You could also create a new route for that filtering, maybe /reports/:name, and avoid using forms. In this case, you only create some links that point to the right filter (/reports/daily, /reports/weekly, etc). On the server-side you need to check reports[:name] for the appropriate value.

Resources