I'm working with Webworks for blackberry and i cant get to fire change on the device, in ripple it works like a charm but in the devices the change event doesn't fire...
hope some1 can help me
HTML
<select name="motherCat" onchange="motherChanged(event)">
<option value="0">option0</option>
<option value="1">option1</option>
<option value="2">option3</option>
</select>
<select id="subCategory">
<option value="0">wait mother change to fill</option>
</select>
Javascript
function motherChanged(event){
alert("motherChanged");
var retCategory =subcategories[event.target.value];
var fin = retCategory.length;
var slCat = $('subCategory');
slCat.length = 0;
for(var i = 0;i<fin;i++){
slCat.options.add(new Option(retCategory[i].text,retCategory[i].value));
}
}
The problem is in how you've set the onchange property. event is undefined. Rather use something that will be defined:
<select name="motherCat" onchange="motherChanged(this)">
The this parameter will be the select element itself. Of course, you could also have a function that accepts no parameters, and then you can leave out the this.
You could also use
<select name="motherCat" onchange="motherChanged">
and JavaScript should call the function with the event as a parameter.
Related
Hey so basically this is my code, the first script running allows the selected value to be displayed in the URL.
<!-- Adds selected value to current url extensions -->
<script>
$(function() {
var collectParams = function() {
var params = {
Region:$("#search_region").val()
};
if(params.Region) {
location.hash=jQuery.param(params)
}
};
$("#search_region").change(collectParams);
});
</script>
<!-- Adds selected value to current url extensions -->
<select name="search_region" id="search_region" class="search_region">
<option value="0">All Regions</option>
<option class="level-0" value="135">135</option>
<option class="level-0" value="136">136</option>
<option class="level-0" value="137">137</option>
<option class="level-0" value="139">139</option>
<option class="level-0" value="138">138</option>
</select>
Below is the second script running. It's used to store the selection, it all works fine but is there any way to keep the selection stored once i copy the link along with stored selected value (eg: www.example/dropdown-test.html#Region=137) to another browser or if anyone else uses it for it to have my previous selection stored and displayed on their side?
<!-- Stores selected value locally after page refresh -->
<script>
$(function() {
if (localStorage.getItem('search_region')) {
$("#search_region option").eq(localStorage.getItem('search_region')).prop('selected', true);
}
$("#search_region").on('change', function() {
localStorage.setItem('search_region', $('option:selected', this).index());
});
});
</script>
<!-- Stores selected value locally after page refresh -->
I'm not sure if this makes sense but that's the best i can explain.
I also only need to be able to do this with javascript no php
Thanks in advance
If you are about to share data between two clients directly, you will be facing numerous obstacles and since you just ask about the basic concept, I would not recommend you trying to code that directly, rather first study your options. If you want the data spread over larger pool of users, then you really should use some server side solution (lets say something like Firebase).
PEERS
Most likely you will go with some peer-to-peer setup. There are numerous technologies trying to target it, but all are somewhat tricky. Not all are well supported, some are buggy, others difficult to setup.
TO STUDY RECOMMENDATIONS
https://webrtc.org/
http://www.websocket.org/
IMPLEMENTATION
I suggest you first pick the technology you like. Then try to implement it and then you might like to post new questions regarding the specific issues, you will be facing then.
If you go with P2P, I wish you best of luck. This sounds like from zero to hero story.
Stores previous selected # value in URL and carries it over to another users PC when link is copied. If there's any simpler way of doing it, hola
<select name="search_region" id="search_region" class="search_region">
<option value="0">All Regions</option>
<option class="level-0" value="135">135</option>
<option class="level-0" value="136">136</option>
<option class="level-0" value="137">137</option>
<option class="level-0" value="139">139</option>
<option class="level-0" value="138">138</option>
</select>
<script type="text/javascript">
$(function(){
$('#search_region').change(function () {
var url = $(this).val();
window.location.hash = url;
console.log('select Changed');
});
});
window.addEventListener('hashchange', fn, false);
window.onload = fn; // fire on pageload
function fn() {
$('#search_region').val(window.location.hash.replace('#', ''));
console.log("hash = " + window.location.hash);
}
</script>
I am having some issues with a search form I created based on two drop downs. Pretty simple but, I cant seem to find the issue. I'm still pretty green at this.
Here is the html:
<form id="CustomSearch">
<select id="Location">
<option value='northeast'>North East</option>
<option value='west'>West</option>
<option value='midwest'>Mid West</option>
<option value='south'>South</option>
</select>
<select id="Style">
<option value='industrial'>Industrial</option>
<option value='farmhouse'>Farmhouse</option>
<option value='contemporary'>Contemporary</option>
<option value='beach+style'>Beach Style</option>
<option value='traditional'>Tradtional</option>
</select>
<button id="DropSearch">
Here is the js:
var location = jQuery('#Location').val();
var style = jQuery('#Style').val();
jQuery(document).ready(function(){
jQuery('#DropSearch').click(function (e){
jQuery.post('http://showroomworldwide.com/?geodir_search=1&stype=gd_place&s=' + location + '&stype=gd_place&s=' + style);
});
});
Once the script is added to the footer of the site, I get a never ending loop, almost like if the function was firing before actually clicking on the button.
There's no need from what I can see to be doing a POST request - just set window.location.href also wrapping your jQuery in an IIFE and passing $ as an argument can be a handy way of making $ available to you if you need to use jQuery in noconflict mode.
Finally as #ADyson mentions you need to set retrieve location and style within the event handler otherwise you'll be stuck with the initial values.
(function($){
$(document).ready(function(){
var location = $('#Location').val();
var style = $('#Style').val();
$('#DropSearch').click(function (e){
window.location.href = 'http://showroomworldwide.com/?geodir_search=1&stype=gd_place&s=' + location + '&stype=gd_place&s=' + style; // Can't just reference location.href due to local variable
});
});
}(jQuery));
So, I want certain fields to reset or clear whenever the previous selector changes. I can get select tags to go back to the default option but can't get text input fields to clear out.
Here is the jsfiddle to give you an idea of what I'm talking about: http://jsfiddle.net/wsk3opbf/
Below is my code:
HTML
<select id="type">
<option>--Select--</option>
<option>45ppm</option>
<option>55ppm</option>
</select>
<input id="testone" type="text">
</input>
<select name="mediumcopier" id="mediumcopier">
<option value="">--Select--</option>
<option value="">no</option>
<option value="onecopier">yes</option>
</select>
<select name="largecopier" id="largecopier">
<option value="">--Select--</option>
<option value="">no</option>
<option value="onecopier">yes</option>
</select>
jquery
$('#type').change(function(){
$('#smallcopier, #mediumcopier').prop('selectedIndex',0);
$('#testone'.val() = '');
});
You don't have anything with an id smallcopier, and the set for testone was incorrect, try
$('#type').change(function(){
$('#mediumcopier, #largecopier').prop('selectedIndex',0);
$('#testone').val('');
});
You provide new value as an parameter/argument to the val() function like below
$('#type').change(function(){
$('#smallcopier, #mediumcopier').prop('selectedIndex',0);
$('#testone').val('');
});
Actually, .val() just returns a value that you can store into a variable.
If you want to change the actual value of the selector, you have to pass it as a parameter.
$('#testone').val('');
It should be
$('#testone').val('') ;
not you can't assign like this
$('#testone').val = '';
because val is method or function of jQuery object where parameters are passed as ('') or ('any value'), it's not variable to assign
Your code:
$('#testone'.val() = '');
Can't work, this is a syntax error; you have a misplaced ), it should be – syntactically, but still 'broken' – as follows:
$('#testone').val() = '';
This, however, will give an error of Invalid left side in assignment (or similar) because you're trying to assign an empty string to another string. What I suspect you want is:
$('#testone').val('');
Which will set the value of the #testone element to the empty string, or, possibly, to set the <input> back to the default value:
$('#testone').val(function () {
return this.defaultValue;
});
How do i select an option from the select tag?
This form contains only one select tag and no submit button. When an option is selected, it is supposed to call the javascript function __doPostBack('D1','') which adds more content to the same page.
<select name="D1" onchange="__doPostBack('D1','')" language="javascript" id="D1">
<option value="0">- Select -</option>
<option value="1">option1</option>
<option value="3">option2</option>
<option value="5">option3</option>
</select>
Although I don't have that much experience with mechanize, I believe it should be something like this:
control = form.find_control('D1')
control.value = ['3']
Unfortunately, WWW:Mechanize does not have a Javascript engine. It's said here : http://wwwsearch.sourceforge.net/mechanize/faq.html#script
There are some workaround, but it's not sure the method will work 100% of the time.
#Changing the control
br.select_form(nr=0) # select the first form : try to locate your form and adapt the line
form = br.form
form['D1'] = ['3']
#Submitting the changes
request2 = form.click() # mechanize.Request object
try:
response2 = mechanize.urlopen(request2)
except mechanize.HTTPError, response2:
pass
The other solution is to automate a headless browser (like Selenium with PhantomJS )
I have a html form
Inside of this form in select option i have called one java script function like
<form>
<SELECT NAME="sel" onChange="split('1')">
<OPTION VALUE=1>Milk</option>
<OPTION VALUE=2>tea</option>
<OPTION VALUE=3>water</option>
<OPTION VALUE=4>coffee</option>
</SELECT>
</form>
function split(str)
{
var str=str+str;
return str;
}
Now i need to get these return value on inside of the form for example in another select
<SELECT NAME="sel123" >
<OPTION VALUE="str">Milk</option>
</SELECT>
can anyone help me?
HTML can't do anything with variables. It isn't a programming language.
You aren't very specific about what you want to do, but it will probably involve writing JS to perform DOM manipulation.
You can have a place where you can display the value. For example.
function split(str)
{
var str=str+str;
$('classoridofelementhere').html(str);
}
EDIT
Here is an example on how to move option from one list to another: http://calisza.wordpress.com/2009/03/29/6-jquery-snippets-you-can-use-to-manipulate-select-inputs/
Remember to download and put a reference to jQuery library.