I am trying to just display a drop down menu using famo.us:
var selector = new Surface({
size:[200,200],
content: ' <select>
<option value="1"> 1</option>
<option value="2"> 2</option>
<option value="3"> 3</option>
</select>'
});
what is wrong in this?
You need to add backslashes to extend the string to each next line.
Here is what that would look like..
var selector = new Surface({
size:[200,200],
content: ' <select> \
<option value="1"> 1</option> \
<option value="2"> 2</option> \
<option value="3"> 3</option> \
</select>'
});
Hope it helps!
Related
How to get the value from the dropDown Box in Django Without Submit Button
<div class="single-shorter">
<form action="." method="GET">
<label>Sort By :</label>
<select name="val" id="val">
<option selected="selected" value="name">Name</option>
<option value="price">Price</option>
</select>
</form>
</div>
You can simple obtain it using Ajax but as mentioned in comments in dont want to use that u can use value attribute in option value and using event listner and window.loction.href we can obtain this... This is one example
<select id="foo">
<option value="">Your Dropdown</option>
<option value="http://www.google.com">x</option>
<option value="http://www.facebook.com">y</option>
</select>
<script>
document.getElementById("foo").onchange = function() {
if (this.selectedIndex!==0) {
window.location.href = this.value;
}
};
</script>
as u are using django use this and also dont want to change the value attribute
<select id="my_selection">
<option value="x" href="/link/to/somewhere">value 1</option>
<option value="y" href="/link/to/somewhere/else">value 2</option>
</select>
<script>
document.getElementById('my_selection').onchange = function() {
window.location.href = this.children[this.selectedIndex].getAttribute('href');
}
</script>
i have a table with this select:
<tr class="tr_clone">
<td>
<select style="width:200px" name="itens[]" class="itemname">
<option value="0"></option>
<option value="1">Item A</option>
<option value="2">Item B</option>
<option value="3">Item C</option>
</td>
in jquery, I am trying to get the text of the selected item (Item A when 1 is selected). I am then putting this value to another text box, (named 'note'). I can put the index value but not the text of the select.
$("table").on('change', '.itemname', function() {
var prtCont = $(this).parent().parent();
var code = prtCont.find('.itemname').val();
prtCont.find('.note').val(code);
});
what should I change in my jquery?
Well, 1st close the select tag.
<tr class="tr_clone">
<td>
<select style="width:200px" name="itens[]" class="itemname">
<option value="0"></option>
<option value="1">Item A</option>
<option value="2">Item B</option>
<option value="3">Item C</option>
</select>
</td>
</tr>
To get the text of the selected item you can do:
$('.itemname option:selected').html()
Your jQuery is a little confuse, for me is better:
$('.itemname').on('change' , function() {
var prtCont = $(this).parent().parent();
code = $(this).val(); // Get the value
text = $('.itemname option:selected').html(); // Get the text
prtCont.find('.note').val(code + ' ' +text);
});
I am trying to pass custom data attributes to my selectize component. Below is the static HTML generated which I wish to selectize:
<select id="colour-filter" data-reactid=".0.1.0.2.0.0.1.0">
<option value="" data-data="false" data-reactid=".0.1.0.2.0.0.1.0.$blank"></option>
<option value="2" data-data="#FFFFFF" data-reactid=".0.1.0.2.0.0.1.0.1:$2">White</option>
<option value="1" data-data="#FF0000" data-reactid=".0.1.0.2.0.0.1.0.1:$1">Red</option>
<option value="3" data-data="#C0C0C0" data-reactid=".0.1.0.2.0.0.1.0.1:$3">Silver</option>
<option value="4" data-data="#808080" data-reactid=".0.1.0.2.0.0.1.0.1:$4">Gray</option>
<option value="5" data-data="#800000" data-reactid=".0.1.0.2.0.0.1.0.1:$5">Maroon</option>
<option value="0" data-data="false" data-reactid=".0.1.0.2.0.0.1.0.$showAll">All colours</option>
</select>
But, I am getting the following error, when this piece of code (JSON.parse("#FFFFFF")) is executed inside selectize:
VM11923:1 Uncaught SyntaxError: Unexpected token # in JSON at position
0
Even if I remove the # from the data attribute, it doesn't work.
Why is selectize not able to generate the data JSON for this html? How do I work around instead?
This is jsfiddle - https://jsfiddle.net/gutzmnsw/
It worked well with the following HTML, though I wonder why do I have to send the JSON and sending just the attribute value for data-data won't work, and there is no mention in the documentation about this:
<select id="colour-filter" data-reactid=".0.1.0.2.0.0.1.0">
<option value="" data-reactid=".0.1.0.2.0.0.1.0.$blank"></option>
<option value="2" data-data="{"hex":"#FFFFFF"}" data-reactid=".0.1.0.2.0.0.1.0.1:$2">White</option>
<option value="1" data-data="{"hex":"#FF0000"}" data-reactid=".0.1.0.2.0.0.1.0.1:$1">Red</option>
<option value="3" data-data="{"hex":"#C0C0C0"}" data-reactid=".0.1.0.2.0.0.1.0.1:$3">Silver</option>
<option value="4" data-data="{"hex":"#808080"}" data-reactid=".0.1.0.2.0.0.1.0.1:$4">Gray</option>
<option value="5" data-data="{"hex":"#800000"}" data-reactid=".0.1.0.2.0.0.1.0.1:$5">Maroon</option>
<option value="0" data-reactid=".0.1.0.2.0.0.1.0.$showAll">All colours</option>
</select>
Selectized my component this way:
$('#colour-filter').selectize({
plugins: ['restore_on_backspace'],
persist: false,
allowEmptyOption: true,
selectOnTab: true,
render: {
option: (item, escape)->
if item.hex && item.hex == "#FFFFFF"
option_html = '<div>' + '<div style="background-color: ' + item.hex + ';border: 1px solid black"></div><span>' +
escape(item.text) + '</span>' + '</div>';
else if item.hex
option_html = '<div>' + '<div style="background-color: ' + item.hex + '"></div><span>' +
escape(item.text) + '</span>' + '</div>';
else
option_html = '<div>' + escape(item.text) + '</div>';
return option_html
},
I'm trying to fill the form that is at www.wetseal.com/Stores that allows selecting the state to show stores from.
<form action="http://www.wetseal.com/Stores?dwcont=C73689620" method="post" id="dwfrm_storelocator_state">
<fieldset>
<div class="form-row required ">
<label for="dwfrm_storelocator_address_states_stateUSCA">
<span>State</span>
<span class="required-indicator">*</span>
</label>
<select id="dwfrm_storelocator_address_states_stateUSCA" class="input-select required" name="dwfrm_storelocator_address_states_stateUSCA">
<option value="">Select...</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="PR">Puerto Rico</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
</select>
</div>
<button type="submit" name="dwfrm_storelocator_findbystate" value="Search">
Search
</button>
</fieldset>
</form>
Looking with Chrome I can see the request being made and the form params:
That said, I have a very simple spider that, looking at the docs, sends a FormRequest to that URL to fill the form (In this case I'm testing for Arizona shops - AZ):
class WetSealStoreSpider(Spider):
name = "wetseal_store_spider"
allowed_domains = ["wetseal.com"]
start_urls = [
"http://www.wetseal.com/Stores"
]
def parse(self, response):
yield FormRequest.from_response(response,
formname='dwfrm_storelocator_state',
formdata={'dwfrm_storelocator_address_states_stateUSCA': 'AZ',
'dwfrm_storelocator_findbystate': 'Search'},
callback=self.parse1)
def parse1(self, response):
print response.status
print response.body
When it gets to make the FormRequest, looking at the response, everything seems OK:
But in the callback method, I see this in the response:
It looked like a GET request was made at the end, and the url is all wrong:
'http://www.wetseal.com/Search?q=&dwfrm_storelocator_findbystate=Search&dwfrm_storelocator_address_states_stateUSCA=AZ'
Any idea what I'm doing wrong?
Thanks!
You're using formname but the form doesn't have a name.
Try using formxpath='id("dwfrm_storelocator_state")' instead.
try this
states = response.xpath(
".//select[#id='dwfrm_storelocator_address_states_stateUSCA']//option[#value!='']/#value").extract()
url = self.get_text_from_node(response.xpath("//form[#id='dwfrm_storelocator_state']/#action"))
for state in states:
form_data = {'dwfrm_storelocator_address_states_stateUSCA': state,
"dwfrm_storelocator_findbystate": "Search"}
yield FormRequest(url,
formdata=form_data,
callback=self.your_Callback)
I need some help ...
I need the location drop down box to determine the appropriate inbox the form should be sent to.
ex if I choose Houston from the drop down box it will send it to the PayrollUSA email.
Im currently using a radio button to make the selection but i would like to automate with the drop down.
Im pretty new to this but im sure theres a if statement that can tie them together...
im using .asp for this.
<input type="radio" name="payroll" value="PayrollUSA#mail.com" checked="checked">US Payroll
<input type="radio" name="payroll" value="PayrollCAN#mail.com">CAN Payroll
<input type="radio" name="payroll" value="PayrollUK#mail.com">UK Payroll
<input type="radio" name="payroll" value="PayrollHK#mail.com">HK Payroll
Drop down selection
<SELECT SIZE="1" NAME="Business_Unit" style="width: 205px;" class="answers">
<option selected >Select</option>
<OPTION>Calgary</OPTION>
<OPTION>Chicago</OPTION>
<OPTION>Hong Kong</OPTION>
<OPTION>Houston</OPTION>
<OPTION>London</OPTION>
<OPTION>Los Angeles</OPTION>
<OPTION>Montreal</OPTION>
<OPTION>New York</OPTION>
<OPTION>New York Corporate</OPTION>
<OPTION>Philadelphia</OPTION>
<OPTION>San Francisco</OPTION>
<OPTION>Toronto</OPTION>
<OPTION>Toronto Corporate</OPTION>
<OPTION>Vancouver</OPTION>
</SELECT>
If you need the option value to be held then try this:
<SELECT SIZE="1" NAME="Business_Unit" style="width: 205px;" class="answers">
<option value="">Select an Option</option>
<option <% if Business_Unit= "PayrollCAN#mail.com" then %> selected <% End if %> value="PayrollCAN#mail.com">Calgary</option>
<option <% if Business_Unit= "PayrollUSA#mail.com" then %> selected <% End if %> value="PayrollUSA#mail.com">Chicago</option>
</select>
etc. for each option and same value may be used for different option displays
I imaging this should just be html based. So your option menu should look like:
<SELECT SIZE="1" NAME="Business_Unit" style="width: 205px;" class="answers">
<option value="-1">Select an Option</option>
<OPTION value="PayrollCAN#mail.com">Calgary</OPTION>
<OPTION value="PayrollUSA#mail.com">Chicago</OPTION>
<OPTION value="PayrollHK#mail.com">Hong Kong</OPTION>
<OPTION value="PayrollUSA#mail.com">Houston</OPTION>
<OPTION value="PayrollUK#mail.com">London</OPTION>
<OPTION value="PayrollUSA#mail.com">Los Angeles</OPTION>
<OPTION value="PayrollCAN#mail.com">Montreal</OPTION>
<OPTION value="PayrollUSA#mail.com">New York</OPTION>
<OPTION value="PayrollUSA#mail.com">New York Corporate</OPTION>
<OPTION value="PayrollUSA#mail.com">Philadelphia</OPTION>
<OPTION value="PayrollUSA#mail.com">San Francisco</OPTION>
<OPTION value="PayrollCAN#mail.com">Toronto</OPTION>
<OPTION value="PayrollCAN#mail.com">Toronto Corporate</OPTION>
<OPTION value="PayrollCAN#mail.com">Vancouver</OPTION>
</SELECT>
You can use the same value multiple times if needed