Help with asp.net mvc and Select List Dropdown - asp.net-mvc

I want to build this dropdowns with these specific attributes.. How can I do this? Im using LinqToSql. Each Company has employees
<select name="companies" id="companies" class="selectable">
<option value="">-- select --</option>
<option value="1" title="company1">Company1</option>
<option value="2" title="company2">company2</option>
<option value="3" title="company3">company3</option>
<option value="4" title="company4">company4</option>
</select>
<select name="employees" id="employees" class="selectable">
<option value="">-- select --</option>
<option value="1" class="company1">John</option>
<option value="2" class="company1">michale</option>
<option value="4" class="company2">brian</option>
<option value="5" class="company2">mark</option>
<option value="6" class="company3">daniel</option>
<option value="7" class="company3">rose</option>
</select>
Do I have to build my own helper? please help.
this all comes from Database and I have Company and Employee with LINQTOSQL classes

As far as I know yes... The default html helper doesn't give you the ability to set the title or the class attribute on the options...
I would recommend building your own (or looking around to see if someone else has done one that solves this problem).
If you do build your own I would use lambda's (anonymous linq delegates) to capture/define the attributes your are after for the options. That way you can reuse it over and over. Let me know if you need help with this.

In asp.net MVC you already have a lot of built in Helpers. For the dropdown I would do something like this :
<%= Html.DropDownList("<name>", "<selectlist collection>", new { #class = "<css class>", title = "<title>" }) %>

Related

Drop down popup is not showing using marionette.js and jquery mobile

I am using marionette.js and jquery mobile for my application. Following is the code that I have used in template file for drop down but its not working, I have used "data-native-menu=false" for displaying option in popup
<div id="whatDiv" data-role="fieldcontain">
<label >Main Category</label><br>
<select data-native-menu=false>
<option value=1> Balance </option>
<option value=2> 2 </option>
<option value=3> 3 </option>
<option value=4> 4 </option>
<option value=5> 5 </option>
</select>
</div>
Thanx in advance
i think you want like this , see below jsfiddle links
www.jsfiddle.net/57eJm/

How to validate radio buttons, selects, and checkboxes on iPad

JSFiddle demonstrating the problem... http://jsfiddle.net/9Lzj6/2/
I am using the jQuery Validation Plugin http://docs.jquery.com/Plugins/Validation && https://github.com/jzaefferer/jquery-validation to validate a form.
JS
<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<script type="text/javascript">
$("#patient_info_form").validate({
rules: {
"data[gender]": {required :true},
"data[dob_month]": "required",
"data[dob_day]": "required",
"data[dob_year]": "required"
}
});
</script>
HTML
<form id="patient_info_form" name="patient_info_form" action="..." method="post">
<select name="data[dob_month]" id="data[dob_month]" required="required">
<option value="" selected="selected"></option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
</select>
<select name="data[dob_day]" id="data[dob_day]" required="required">
<option value="" selected="selected"></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select name="data[dob_year]" id="data[dob_year]" required="required">
<option value="" selected="selected"></option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
</select>
<label for="gender_male" class="button_gender male">
<input type="radio" name="data[gender]" value="male" id="gender_male" required="required">
</label>
<label for="gender_female" class="button_gender female">
<input type="radio" name="data[gender]" value="female" id="gender_female" required="required">
</label>
</form>
iPad PROBLEM
It works perfectly in a standard browser (tested in Chrome), but it doesn't work at all on an iPad. I am 100% new to programming for an iPad and (unfortunately for me) this site will only be accessed via iPad.
Is there something more I need to do with the jQuery Validation Plugin to get it to work on an iPad? I also tried jQuery Mobile without luck, but I'm willing to give it (or anything else) another shot with guidance.
Can someone please provide links to a tutorial, plugin, or example code that will show me how to validate selects, radio groups (no default, but one selection required), and checkboxes (no default, but one selection from a list required - not shown in the example code above but I will need that too)?
P.S. I don't need a popup or error message. I simply need to stop the form submission if all the requirements are not met.
Thanks in advance for the help.

Proper way to use Select tags with POST in Rails?

I'm building a rails app right now where a user will select a date with the form below and press the Submit button.
Three questions:
1) What is the correct way to get this to post to my DB?
2) Does my submit button need to be inside of my form tag?
3) How do I generate a scaffold to take these fields correctly?
Thanks in advance for the help. I really do appreciate this wonderful community and look forward to giving back one day when I'm more adept.
<div id="dateFields">
<form accept-charset="UTF-8" method="post">
<select name="lunchMonth">
<option>Month</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
<select name="lunchDay">
<option>Day</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="lunchYear">
<option value="2011">2011</option>
</select>
</form>
</div> <!-- End DateField -->
<br /><br />
<a class="whiteButton" href="#confirmed" type="submit" value="send">Confirm</a>
While starting with an existing blob of HTML and then trying to build an RoR controller/model to receive information from the form is certainly possible... it's a bit unusual. Typically, one would also use RoR views/form helpers to render the HTML, which clearly was not done in this case.
It's hard to answer your question, as posed, because you are starting from a slightly odd place. I think all would become clearer to you if wrote a few example forms/controllers/models using RoR scaffolds for all parts of the MVC framework. Maybe start with Rails for Zombies?
I think #213 Calendars episode from railscasts will help you to understand the date picker and make it in proper way.

grails g:select tag

I am using a g:select tag like this:
<td><g:select name="newCity"
id="${'newCity_' +cityData.uid}"
from="${cityData.name}"
value="${cityData.someValue}"
noSelection="${['null':'Select City...']}" class="newCity" />
</td>
which renders the following HTML:
<td>
<select name="newCity" id="newCity_abc" class="newCity" >
<option value="null">Select City...</option>
<option value="A" >A</option>
<option value="B" >B</option>
<option value="C" >C-</option>
<option value="D" >D</option>
</select>
</td>
However, I want my HTML to look like this; with class inserted since I am doing some javascript validation:
<td>
<select name="newCity" id="newCity_abc" class="newCity" >
<option value="null">Select City...</option>
<option value="A" class="populated" >A</option>
<option value="B" class="notpopulated" >B</option>
<option value="C" class="populated" >C</option>
<option value="D" class="notpopulated" >D</option>
</select>
</td>
Is this possible?
Do I need to create a custom tag library to acheive this?
Any help will be appreciated, Thanks!
I don't believe this is possible. The select tag implementation (which writes out the <option> tags) calls the private method writeValueAndCheckIfSelected to fill in the option, and this is not aware of any class names.
There is a 2 year old New Feature Request on the Grails JIRA, but I think you may be stuck rolling your own tag to do this for your specific situation.

Help with rails collection select

I need to add different values for each option tag in my collection_select cause Im trying to use this jquery plugin.... How do I do that?
Heres my collection select code
<%= e.collection_select(:id,State.all,:id,:name) %>
The output should be something like
<select name="state[id]" id="state_id" class="selectable">
<option value="">-- select --</option>
<option value="1" title="florida">Florida</option>
<option value="2" title="georgia">Georgia</option>
</select>
Please help.
Hmm, I believe you gotta write your own helper to do so.

Resources