I have added a rad combobox to a page and need to be able to get the selected value from it. I can see below the html element a hidden field called 'mycontrol_ClientState' I take it this is where I am meant to retrieve the value from however I dont know how to.
Does anyone have an example of getting the value out clientside?
Use the get_value() JavaScript method:
var combobox = $find("<%= RadComboBox1.ClientID %>");
var value = combobox.get_value();
Related
I'm trying to show a value I typed in a Telerik RadDatePicker control:
function validateDates() {
var date1 = $('<%= RadDatePicker1.ClientID %>');
alert(date1.value);
return true;
}
When the sate is valid like 1/23/2009, it prints it, if I type a string value or leave it empty, the alert doesn't show anything.
Why is that?
I'm trying to validate the values before calling the server and need to figure this out.
Let me know please, what I'm missing.
Get the reference to the client side component with $find and use its own client API, there should be something like .get_value()
I have view for showing Member details. Inside there is an EditorFor element which represents subjects taken by the member.
#Html.EditorFor(m => m.Subject)
Inside the editor template there is a Html.DropDownListFor() which shows the selected subject and button to delete that subject
I am using an Html.DropDownListFor element as :
#Html.DropDownListFor(m => m.SubjectID, Enumerable.Empty<SelectListItem>(), "Select Subject",
new { #class = "form-control subjects" })
The second parameter(source) is set empty since I want to load the source from an AJAX request; like below:
$.getJSON(url, function (response) {
$.each(response.Subjects, function (index, item) {
$('.subjects').append($('<option></option>').text(item.Text).val(item.ID));
});
// code to fill other dropdowns
});
Currently the html loads before the dropdowns are filled. So the values of all subject dropdowns are set to the default "Select Subject". Is there a way around this or is it the wrong approach?
Note: There are a number of dropdowns in this page. That's why I would prefer to load them an AJAX request and cache it instead of putting in viewModel and filling it for each request.
** EDIT **
In AJAX call, the action returns a json object containing dropdowns used across all pages. This action is decorated with [Output Cache] to avoid frequent trips to server. Changed the code in $.each to reflect this.
You can initially assign the value of the property to a javascript variable, and use that to set the value of the selected option in the ajax callback after the options have been appended.
// Store initial value
var selectedId = #Html.Raw(Json.Encode(Model.Subject.SubjectID))
var subjects = $('.subjects'); // cache it
$.getJSON(url, function (response) {
$.each(response, function (index, item) {
subjects.append($('<option></option>').text(item.Text).val(item.ID));
});
// Set selected option
subjects.val(selectedId);
});
However its not clear why you are making an ajax call, unless you are generating cascading dropdownlists which does not appear to be the case. What you doing is basically saying to the client - here is some data, but I forgot to send what you need, so waste some more time and resources establishing another connection to get the rest of the data. And you are not caching anything despite what you think.
If on the other hand your Subject property is actually a collection of objects (in which case, it should be Subjects - plural), then the correct approach using an EditorTemplate is explained in Option 1 of this answer.
Note also if Subject is a collection, then the var selectedId = .. code above would need to be modified to generate an array of the SubjectID values, for example
var selectedIds = #Html.Raw(Json.Encode(Model.Subject.Select(x => x.SubjectID)))
and then the each dropdownlist value will need to be set in a loop
$.each(subjects, function(index, item) {
$(this).val(selectedIds[index]);
});
If your JSON tells you what option they have selected you can simply do the following after you have populated your dropdown:
$('.form-control.subjects').get(0).selectedIndex = [SELECTED_INDEX];
Where [SELECTED_INDEX] is the index of the element you want to select inside the dropdown.
i am using material UI dropdown component and trying to run a callback function only when user fills all the form and submits the form. On the call back function i intend to collect all the form field and generate url to call to api.
My problem is that i can not use onChange as stated solution in #560 as i want to collect all the detail only when user clicks the submit button. It is also weird that at the moment, i am able to get value of all the other form element like slider, textfield which uses material-ui but only dropdown does not seem to be working.
My call back function:
handleFilter: function(event){
event.preventDefault();
var location = this.refs.location.getValue();
var posted_date = this.refs.posted_date.getValue();
var radius = this.refs.distance.getValue();
var salary = this.refs.salary.getValue();
var jobtype = this.refs.jobtype.getValue();
console.log(jobtype);
}
In the above function "location, posted_date, radius, salary" returns value but "jobtype" which happens to be dropdown does not seem to return any value. It returns this error in console:
"Uncaught TypeError: this.refs.jobtype.getValue is not a function"
Here is my dropdown component :
<DropDownMenu menuItems={menuItems} ref="jobtype" />
May not be the right way but i figured out that
console.log(this.refs.jobtype) (jobtype is the refs value of dropdown in my case)
was giving the following result.
R…s.c…s.Constructor {props: Object, context: Object, state: Object, refs: Object, _reactInternalInstance: ReactCompositeComponentWrapper}
Inpecting it i found value of payload index (index number of selected item) inside state object within "selectedIndex" property. I used following code to access the selected index:
var jobtype = this.refs.jobtype.state.selectedIndex;
If there is a better way to do this please suggest.
Is it possible to identify on a kendo UI grid which field was altered on a row edit?
Right now I am sending the entire row to the server that was changed. I would like to send
the request to the server to also include a variable holding the name
of the field that was edited.
Is something like that supported by kendo or
is there a work around for that?
This is not supported out of the box. However the grid API should allow this to be implemented. Check the edit and save events. In there you can listen to changes of the model instance which is currently being edit. Here is a quick example:
$("#grid").kendoGrid({
edit: function(e) {
e.model.unbind("change", model_change).bind("change", model_change);
}
});
function model_change(e) {
var model = this;
var field = e.field;
// store somewhere the field and model
}
I have a page of products and for each of them, I want to have a form that uses AJAX to update the session. I've done this bit - just providing background.
I use the product's ID to create a different form class and name for each form, so each form is called something like this_form_name_567 and the next would be this_form_name_568 and so on.
There is a submit button per form. I'm having trouble figuring out
Which event is best to use so that the correct form will be identified when a submit button is clicked?
Once clicked, how to then make sure the correct value is taken from a hidden field (unique ID) within the submitted form so that I can populate a line of code such as:
$.post("compare_response.php", {compare_this: $("#compare_this").val()}, function(data){
}
You can use the .closest tree traversal method to get the form in which the button of interest is nested:
$("input[type=submit]").click(function() {
alert($(this).closest("form").attr("id"));
});
or even simpler, just get the element's form property :)
$("input[type=submit]").click(function() {
alert(this.form.id);
});
You can try it out here.
You can get the form you are submitting like this:
$('form').submit(function() {
var yourForm = $(this);
var hiddenValue = $(this).find('input[type=hidden]').val();
});
Of course you can get the hidden value differently, or if you have more than one hidden you'll have to give a little more information about it.