Capturing Rails 3 Multiselect Input Params - ruby-on-rails

I have a multiselect form control (fig. 1). When I select more than 1 value, Firefox sends both values (fig. 2). But only the last value gets sent as a input value to my controller (fig. 3). How do I get all those values passed on to my controller?
<form action="html_items/search" method="post" >
<!-- Criteria -->
<div style="float:none;">
<label>Content Provider </label>
<select multiple id="content_provider" name="content_provider">
<option value="FLR">Flare</option>
<option value="SLDT">Slashdot</option>
</select>
</div>
<input type="submit" value="Search" />
</form>
fig. 1
Parametersapplication/x-www-form-urlencoded
content_provider FLR
content_provider SLDT
fig. 2
PARAMs[{"content_provider"=>"SLDT", "controller"=>"html_items", "action"=>"search"}]
...
fig. 3
Thanks
Tim

The first thing is that if you want to create an array of the elements that are selected you need to name your <select> something like <select name='foo[]'>
Next... If nothing is selected nothing will show up. This makes sense, but it stumped me for a bit. I was doing ajax where the left select was search results and the right was the completed list.
I just added a .click(function(){}); to my submit button to set every item on the left to selected with jQuery and the items showed up in the parameters as an array. In the below example you should see the first item show up.
<select multiple id="content_provider" name="content_provider">
<option value="FLR" selected>Flare</option>
<option value="SLDT">Slashdot</option>
</select>

Related

Vue 2.0.3 setting option value not working with :value="x" or v-bind:value="x"

https://jsfiddle.net/53jprgse/
I'm not able to get dynamic select option value attributes set using Vue 2.0.3 and :value or v-bind:value bindings. No option values are being set when I use these.
I have to add the static html value="" or value="some value" attribute to get option value attributes to render their dynamic values.
My data set is a simple array of strings.
This is illustrated by inspecting the select elements at the fiddle above.
Can someone tell me what I'm missing here? Seems like this should be very straight forward.
If you want the DOM to actually have the value attribute set by v-bind you have to actually add the value attribute (doesn't matter what it says).
So, in your first 2 selects you basically had this:
<div>
<p>
:value="county"
</p>
<select v-model="filterByCounty">
<option value="">Filter by county...</option>
<option v-for="county in counties" :value="county">
{{ county }}
</option>
</select>
{{ selected_county }}
</div>
If you just add a value to the <option> it will work as you'd like:
<option v-for="county in counties" :value="county" value="">

How to retain state in MVC

I have an asp.net mvc5 web application which has 5 pages. The information on the last three pages are passed from the first two. So it’s like my first two pages are dynamic and last three changes according to the first two.
My program is only doing the following thing
I fill information in first page, hit submit button via post request, fill information in second page and hit submit button from second page. The rest pages display the result only.
But the problem arises when I press back button from browser form second page, change some value in first page and press submit button, I lose all the data from the second page. I want the second page retain its state whatever it was before.
I really don’t know how hard it is. So can some please advise me how to resolve that problem?
Thanks in advance.Here is just Sample code to illustrate This is the second page
<form action="thirdpage.cshtml" method="post">
MARKET VALUE OF HOUSE 2nd page:
<input id="MVOH" type="number" step="any" name="MVH" /><br/><br/>
MORTGAGE OWING 2nd page:
<input id="MO" type="number" step="any" name="MOwing" /><br/><br/>
MORTGAGE REPAYMENT 2nd page
<input id="MPPM" type="number" name="MP" />
<select id="Sel">
<option value="0">Per week</option>
<option value="1">Per fortnight</option>
<option value="2">Per Month</option>
</select><br/><br/>
<div>
<input id="next" type="submit" value="Income Expenses »"/>
</div>
</form>
And the first page is
<form action="secondpage.cshtml" method="post">
MARKET VALUE OF HOUSE:
<input id="MVOH" type="number" step="any" name="MVH" /><br/><br/>
MORTGAGE OWING:
<input id="MO" type="number" step="any" name="MOwing" /><br/><br/>
<td>MORTGAGE REPAYMENT</td>
<td>
<input id="MPPM" type="number" name="MP" />
<select id="Sel">
<option value="0">Per week</option>
<option value="1">Per fortnight</option>
<option value="2">Per Month</option>
</select><br/><br/>
<div>
<input id="next" type="submit" value="Income Expenses »"/>
</div>
</form>
Please I have provided only a part of code because my page is so big.
The only way to do this is to transfer the changes real time to the server, in the keypress/ change events. You could use an ajax call for this.
After the user navigates to this second page for the second time, you can fill the values he enters earlier
Firstly If you are dealing with ASP.NET MVC, I would strongly recommend you to use HTML Helpers to create your view like HTML.TextBox() or HTML.Label() etc, and bind these elements with your model so that at every request the values will be updated as per the type of Request GET / POST.
Secondly Pressing browser's back/forward button shows you the last cached page, due to which the values may be obsolete, I suggest you to have your own next previous button and initiate get request for the same.
In case you are troubled by the browser's button, you can check the page referrer accordingly and have that check at every post request

jQuery mobile group select & text box in one line

I'm trying to group a selectbox and textbox side by side by side using jquery mobile. They are currently displaying below each other. I've tried control group within jquery, but to no avail.
I want to do something like this http://demos.jquerymobile.com/1.3.2/widgets/forms/form-fieldcontain.html though with a select and drop, where this example shows a label and text box side by side.
Here is my current code. Any help appreciated.
<label style="margin-top:30px;background: #ffffff;">Mobile Number:</label>
<select name="mobilePrefix" id="mobilePrefix">
<option value="">Mobile Prefix</option>
<option value="082">082</option>
<option value="083">083</option>
<option value="085">085</option>
</select>
<input class="required" name="mobileno" id="mobileno" value="" data-clear-btn="true" type="tel"/>

Get the selected option's text field in controller in Ruby

I know how to get the value of the selected option in the dropdown in controller. Using
params[:category_id]
My question is for a select like this
<select name="category_id">
<option value="0">New</option>
<option value="1">SubCategory1</option>
<option value="2">SubCategory2</option>
<option value="3">SubCategory3</option>
</select>
How can i also get the selected text after request is posted to controller? So if user selects Option 1, I want "0" as well as "New".
#shaurya, Not sure why you want the text value from the form post. Can you look up the value in config['Categories'] using category_id?

Mark prepopulated select options as selected in asp.net razor

I am trying to do select an option in a select element. I tried the following code. But it does not work.
<select>
<option value="1" #(ViewBag.dt.Rows[0][1].ToString())=="1"? selected>A</option>
<option value="2" #(ViewBag.dt.Rows[0][1].ToString())=="2"? selected>B</option>
<option value="3" #(ViewBag.dt.Rows[0][1].ToString())=="3"? selected>C</option>
</select>
Any help?
Thank you.
Your conditional operators appear incomplete (invalid code).
Did you mean:
<option value="1" #(ViewBag.dt.Rows[0][1].ToString() == "1" ? "selected" : "")>A</option>
I would normally suggest switching to #Html.RadioButtonFor but that will not handle a two-dimensional array references. Are you display multiple items in a loop? You may be able to simplify the whole thing (please show the rest of your page/code).

Resources