how to get checkbox checked when dependent dropdown get changed using Jquery - javascript

Here i like to explain my problem clearly
i have a table called employeedetails, in employeedetails table i have 3 fields designation, company_type and relation
designation - parent dropdown
company_type - child dropdown
here designation and company_type is a dependent dropdown, if i change designation it will automatically changes the dependent company_type.
here relation field contains a checkbox list like
1.father
2.mother
3.wife
4.son
5.self
while if change a designation it will automatically changes the company_type.
for example company_type value is 5 get changed by using dependent dropdown.
i need to get checkbox get checked for the value 5.
here i wrote the code for this, it working when i change the company_type dropdown list manually, but i dont know how to write for dependent dropdown
here is js:
$("#employeedetails-company_type").change(function() {
var value = $("#employeedetails-company_type option:selected").text();
if (value == '5') {
$(":checkbox[value=5]").prop("checked", "true");
$("input[type=checkbox]").not(":checked").attr("disabled", true);
}
});

Related

Retrieve updated array values when the same array is updated with different condition

I want to display a dropdown value based on selection of type in another dropdown in angular
Basically I have an array of values which I will filer it on the based on type selected which is working fine. below is the code of filtering.
filterMethod(){
if(type === 'P'){
this.filteredArray = this.relationArray.filter(ele=> this.personValue.includes(ele.name));
} else{
this.filteredArray = this.relationArray.filter(ele=> this.orgValue.includes(ele.name));
}
}
And in HTML I'm looping it.
<mat-select formControlName="relation" aria-owns="relationshipSelect">
<mat-option *ngFor="let rel of filteredArray" [value]="relation.name">
{{rel.value}}
............
This above HTML is basically a child component where user can multiple dropdown when clicked new button. i.e., another dropdown will come next to it and so on...
Here what is happening is after selecting the relation dropdown when user click new button another relation dropdown is coming but the existing relation dropdown value is vanished. If user fires the filterMethod() method the vanished value will come.
I suspect it is because of calling new button new instance will be created and array will be set to its original state.

Adding multiple fields based on selected values

I am trying to build a simple dropdown where the user can select multiple options and based on the selected options, a corresponding input field will open up. I am using the Chosen jQuery plugin to accomplish this, and used the following JavaScript function to populate the input fields based on selected dropdown values, however it seems to open up only the latest selected value's input field.
To debug this I had created an empty array called selected and appended the chosen dropdown value to it, and then checked if the chosen values were in this array but it still seems to work the same way.
$(document).ready(function(){
var selected = [];
$("select").change(function(){
$(this).find("option:selected").each(function(){
var optionValue = $(this).attr("value");
selected.push(optionValue);
if(selected.includes(optionValue)){
$(".field").not("." + optionValue).hide();
$("." + optionValue).show();
} else{
$(".field").hide();
}
});
}).change();
});

How to choose a specific status list Jquery

please I have a drop down list like
creation
creation from scratch
creation without data
creation pay
modification
modification/specific
modification/clean
and this script
function checkTicketType(tipo) {
console.log("Tipo cambia: "+tipo);
if (tipo.indexOf('Creation')>-1) {
$('#itemId').parent().show(500);
}
else if (tipo.indexOf('Modification')>-1) {
$('#itemId').parent().hide(500);
}
}
When the creation status are selected the itemId box appear, desappear when the modifications are selected.
My problem I want to use the itemId (it can appear only if the status "modification/specific" is selected no more).
Thank you in advance.
Attach change event to select dropdown. Check for selected text on change event.
If it contains modification hide the itemId box (assuming its text input) else if it contains creation show it.
//Change event for dropdown with id ddForEg
$("#ddForEg").change(function(){
if($("#ddForEg option:selected").text().includes('modification'))
{
alert($("#ddForEg option:selected").text());
$('#itemId').hide();
alert($("#ddForEg").val()); //Another way to see value selected. If you assign value to options. No string operations required in that case.
}
else if($("#ddForEg option:selected").text().includes('creation'))
{
$('#itemId').show();
}
})
Fiddle: https://jsfiddle.net/mwoavoqd/

Breeze/Knockout dropdown value is not updated in database if caption is selected instead of value

I am using Breezejs with Durandal in my .net application.
When i try to edit a section which contains
1) Text box
2) Dropdownlist with caption and options
3) TextArea
4) Button
Onclick of edit button, i am binding these controls with their respective values(till then it works fine).
After i change textbox value to "test123" and dropdown values to it's "caption" and clicking on save button. In save function I am creating Breeze entity in modified state and updating them as shown below,
var personEntity = breeze.manager.createEntity('TableName', { Id: id }, breeze.EntityState.Unchanged);
personEntity.entityAspect.entityState.setModified();
personEntity.name(name); //"test123"
personEntity.dropdownValue(status) //I have selected the caption, means value is undefined
personEntity.textArea(address); //No change
then making savechanges() to DB.
In table text box value is updated properly but the value of dropdownlist is not updated(from some value
to Null);
Kindly suggest me some solution so that i can save null value in DB if caption is selected.
Thanks in Advance......
The problem is that the ContextProvider on the server is not detecting that the dropdownValue has changed. It determines the changed properties by looking at the entityAspect.originalValues. Since you create a new entity with dropdownValue = undefined, and you set it to undefined, no change is detected.
Change your code to initialize the dropdownValue to something else:
var personEntity = breeze.manager.createEntity('TableName',
{ Id: id, dropdownValue: 'something' });
personEntity.name(name);
personEntity.dropdownValue(status);
personEntity.textArea(address);

Update Scope by selecting checkboxes

I have two tables that I want to filter by either using an individual select dropdown in the table row or by selecting multiple checkboxes and bulk updating the scope.
A user should be able to check the records, select the top dropdown status, and then the scope gets updated. If the status is greater than or equal to 1 it goes in one table, if less then it goes in the other table.
Fiddle http://jsfiddle.net/TheFiddler/hxz06sd7/
How can I use the checkboxes to update the checked values based upon selected value?
The select
<select ng-options="item.value as item.displayName for item in StatusDropDown" ng-model="person.status" ng-change="updateSelected()"></select>
updatedSelected should take the checked rows and filter:
$scope.updateSelected = function(statusarg){
//how to set status for selected and update tables
}
Associate ng-model (person.selected) to the checkboxes and on-change, filter them out based on the selected property, and apply the value to them.
$scope.updateSelected = function (statusarg) {
//how to set status for selected and update tables
angular.forEach($scope.people, function(person){
person.selected && (person.status = statusarg);
});
}
Fiddle
Earlier issues with your code was that: You should not use track by with select as syntax they are not meant to work together. You would rarely need to use track by with ng-options. Read this for more details.

Categories