how to get combobox text in java script from jsp page - javascript

I want to pass the test in the combobox to another page as included in query string using JavaScript
<select name="classn" id="classnId" onchange="populate()" >
<option value="select">--Select--</option>
<option value="1">I Class</option>
<option value="2">II Class</option>
<option value="3">III Class</option>
here is the populate function
function populate(){
$.ajax({url:"getbatchno.jsp?itid="+$('#classnId').val(),success:function(result){
}});}
but using the above Script I am able to pass only the value part of combobox and I need to pass the text also(I Class,II Class,... etc).

to get text of selected option with jQuery you could use that:
$('#classnId option:selected').text();

Related

Update Parameter value in laravel

Actually I have a URL like this
abc.com?country=india&state=haryana&city=karnal
I have a select option in my code like this
<select onchange="location=this.value;">
<option value="">karnal</option>
<option value="">panipat</option>
<option value="">ambala</option>
<option value="">kurukshetra</option>
</select>
Now I want to change state city parameter in URL? How can I do that?
You can set this URL Like this
Route::get('urlendpoint/{country?}/{state?}/{city?}');

Dynamically change text in php

hey guys i am building a form in which i want when a user select an option from the dropdown menus a text to be displayed and calculate the price.
The dropdown menu is:
<select id="recipient" name="recipient" tabindex="6" class="selmenu">
<option value="staff">Site Staff</option>
<option value="editor">Editor-in-Chief</option>
<option value="technical">Tech Department</option>
<option value="pr">Public Relations</option>
<option value="support">General Support</option>
</select>
and the other dropdown menu is:
<select id="recipient" name="recipient" tabindex="6" class="selmenu">
<option value="one">1</option>
<option value="two">2</option>
<option value="three">3</option>
<option value="four">4</option>
<option value="five">5</option>
</select>
What i want to do is when the user selects something from the first and the second menu i want a textfield to change dynamically... can anyone point me the way?
only ajax/jquery could do that in combination of php step might be...
onchange of any dropdown make a ajax request to php script.
return the json response from php script
use this response to either manipulate your form or display data on page.
you don't need to use php for this, it can all be done with jquery/javscript
an example using jquery is below (i had to rename your second select as you had re-used an ID):
$('.selmenu').change(function() {
$('#output').text($('#recipient option:selected').text() + ' ' + $('#recipient2 option:selected').text());
})
output is the id of your textbox.
on a select value being changed, output will be filled with the selected value in both select controls

Using jQuery multiselect to add values to url hash

The following multi-select control needs to be used to update a url hash containing a comma-separated list of ids.
<select id="options" multiple>
<option id="1">Option 1</option>
<option id="2">Option 2</option>
<option id="3">Option 3</option>
<option id="4">Option 4</option>
<option id="5">Option 5</option>
<option id="6">Option 6</option>
<option id="7">Option 7</option>
</select>
In the example below, Options 2, 3, and 4 are selected in the multi-select control. Selecting and un-selecting options in the multi-select control should update the url hash accordingly.
http://localhost/index#options=2,3,4
I have created a fiddle with the multi-select control but do not know how best to approach the url hash change. I have tried using an href to change the hash but that is not supported within an option tag, and does not provide the logic needed to update the hashes accordingly.
Fiddle
Please let me know if I provide any additional information.
Part of your issue is that in JSFiddle you won't be able to see the hash.
That said if you listen for changes on the <select> you can concatenate the array of values into a string using join() and then set this as a has using window.location.hash.
You could so something like this (based on #popnoodles code)
$( '#options' ).on( 'change', function() {
window.location.hash = $( this ).val().join( ',' );
});
Working demo
Ok without interfering with any of that plugin code
First you need to address your options
use this: <option value="1">Option 1</option>
not this: <option id="1">Option 1</option>
Then this jQuery will do what you want.
$('#options').on('change', function(){
var val=$(this).val();
if (val) hash=val.join(','); // join fails if .val() is null (nothing selected)
else hash='';
window.location.hash=hash;
});

Get value of selectbox option without using .change()

I have a selectbox as follows:
<select id="select_search">
<option value="search_contact">Contact</option>
<option value="search_customer">Customer</option>
<option value="search_employee">Employee</option>
<option value="search_servEmp">Service Employee</option>
<option value="search_servOrg">Service Org</option>
</select>
The above selectbox is part of a search form. When you submit the form, using an ajax request the results are returned to same page asynchronously.
On my results page (the one loaded asynchronously), I have a grouping of other select boxes that act as filters for the results.
<select id="select_customer">
<option value="">something</option>
</select>
<select id="select_contact">
<option value="">something else</option>
</select>
etc....
How can I get the value of the original selectbox (#select_search) to show/hide the appropriate selectboxes that were loaded via ajax. (eg. if search_contact was the selected option, only show the select box with id="search_contact")
The only way I'm familiar with is to get the value of the select box on change, but in this case the affected elements will not be loaded until after the change occurs.
You can Try this in jsFiddle .
$(function () {
$(document).on('change', '#select_search', function () {
$('select:not(#select_search)').addClass('invisble');
var selectSearchVal = $(this).find('option:selected').val();
$('#select_' + selectSearchVal.replace('search_', '')).removeClass('invisble');
});
});
If you're using JQuery $(#select_search).val() should do the trick.
The new way to make a $.live
$(document).on('change', '#select_search', function() {
// change
});

how to assign javascript variable value to jsp tag attribute?

I have a drop down value list, and user will select a value from this dropdown list.
<strong>SelectPageCount: </strong>
<select id="pageCount" onChange = "setPageSizeValue();">
<option value="50">50</option>
<option value="100">100</option>
<option value="150">150</option>
<option value="200">200</option>
<option value="250">250</option>
<option value="500">500</option>
</select>
I have got the value of the dropdown list in this javascript function.
function setPageSizeValue()
{
var dropDownDocument = document.getElementById("pageCount");
var displayElementDocument = document.getElementById("displayTable");
var pagesize = dropDownDocument.options[dropDownDocument.selectedIndex].value;
displayElementDocument.setAttribute('pagesize', dropDownDocument.options[dropDownDocument.selectedIndex].value);
alert(pagesize);
}*
alter is coming properly displaying the value which we set in the dropdown list.
This is our Jsp
In this jsp in pagesize attribute i want to assign the value of pagesize varialbe made in javascript.
<display:table id="displayTable" name="ewCandidateList" sort="list" pagesize="<%=size %>" requestURI="CandidateSearchResult"
decorator="com.thomsonreuters.legal.lem.lpa.ui.decorator.EWCandidateSearchResultDecorator"/>
You are trying to change, on the client side (JS), a variable that is computed on the server side (JSP). It's not possible...
What you can do is create a form and submit it, have a hidden input element that will be posted by the form to the JSP and then re-render the page with the new value. But you probably don't want to do anything like that as well.
What you really want to do is insert all the content of the display-table into a div, and change the size of the div using javascript.

Categories

Resources