How to update viewBag that fill dropdown List in grid in another tab when selecting date in tab in wizard

Hi,

Q1- How to update viewBag value that fill dropdown List in grid in another tab when selecting date from Date Picker in tab in wizard?

Q2- How to update dropdown List DataSource 

when selecting date from Date Picker in tab in wizard?

Thanks Very Much


1 Reply

SK Satheesh Kumar Balasubramanian Syncfusion Team July 27, 2021 02:40 PM UTC

Hi Ahmed, 
  
Thanks for using Syncfusion Products. 
  
Query1 & Query2: 
  
We have validated your reported queries and prepared sample based on your shared details to achieve your requirement. In the below sample, if you change any date in July month of DatePicker, dropdownlist dataSource and value will be changed in grid which is placed inside tab. 
  
  
Index.cshtml: 
<div style="display: none" id="datePicker"> 
    <ejs-datepicker id="Tab_DatePicker" width="200" change="onChange" cssClass="DatePicker" placeholder="Enter date"></ejs-datepicker> 
</div> 
  
<script> 
    function onChange(args) { 
        if (args.value.getMonth() == 6) { 
            var dropdownObj = document.getElementById("ej2_dropdownlist_0").ej2_instances[0]; 
            var dropdownObj1 = document.getElementById("ej2_dropdownlist_1").ej2_instances[0]; 
            var dropdownObj2 = document.getElementById("ej2_dropdownlist_2").ej2_instances[0]; 
            var dropdownObj3 = document.getElementById("ej2_dropdownlist_3").ej2_instances[0]; 
            var dropdownObj4 = document.getElementById("ej2_dropdownlist_4").ej2_instances[0]; 
            var dataSource = ["Badminton", "Cricket", "Football", "Golf", "Tennis"]; 
            dropdownObj.dataSource = dataSource; 
            dropdownObj1.dataSource = dataSource; 
            dropdownObj2.dataSource = dataSource; 
            dropdownObj3.dataSource = dataSource; 
            dropdownObj4.dataSource = dataSource; 
            dropdownObj.value = "Badminton"; 
            dropdownObj1.value = "Badminton"; 
            dropdownObj2.value = "Badminton"; 
            dropdownObj3.value = "Badminton"; 
            dropdownObj4.value = "Badminton"; 
        } 
    } 
</script> 
  
Kindly try the above sample and let us know if this works at your end. If you still face any problem, please share the below details to reproduce the issue which will help us to validate the issue and provide prompt solution as soon as possible. 
  • Share the above sample with modifying code to replicate the issue
  • Share issue replicating sample if possible
  • Share all tab, date picker and grid related code snippets

Regards, 
Satheesh Kumar B 


Loader.
Up arrow icon