Preselect Default Value in DropDown on Load

Dear Syncfusion Support,

How can I pass a default value in the dropdown from my ViewBag in the controller and this value is always preselected in the dropdown on load.

Below I have provided the database table, ViewBag from my controller and the dropdown defined in my razor view. 

I want the default preselected value from my database table to the dropdown to be ICAN which is value 1. 

In other words , How do I pass m.organization_id = 1 to the razor view and ICAN gets preselected ;

Thank You 




A_Organization Table

OrganizationId    Organization
1                              ICAN
2                              USAID

From My Controller (View Bag)

 ViewBag.organization = _context.AOrganization.OrderBy(s => s.Organization).ToList();

            if (ViewBag.organization !=null)
            {
                m.organization_id = 1;
                
            }

DropDown in Razor View

 <div class="col-md-8">
                <ejs-dropdownlist id="organization_id" dataSource="@ViewBag.value" placeholder="Organization" floatLabelType="Never" popupHeight="300px">
                    <e-dropdownlist-fields text="Organization" value="OrganizationId" ></e-dropdownlist-fields>
                </ejs-dropdownlist>
                <span asp-validation-for="organization_id" class="text-danger"></span>
            </div>




3 Replies 1 reply marked as answer

JM Jeyanth Muthu Pratheeban Sankara Subramanian Syncfusion Team October 26, 2020 11:55 AM UTC

Hi Ssekamatte, 

Thanks for contacting Syncfusion support. 

We have checked your query of rendering Dropdownlist with predefined value from view bag. In order to load preselected value, we suggest you to use value property where you can set the value from ViewBag. Please find the sample in the below link. 




public IActionResult Index() 
        { 
            ViewBag.Data = new Vegetables().VegetablesList(); 
            ViewBag.Value = "Onion"; 
            return View(); 
        } 


<ejs-dropdownlist id="dropdown" name="Value" dataSource="ViewBag.data" value="ViewBag.Value" placeholder="Select a country"> 
     <e-dropdownlist-fields value="Vegetable"></e-dropdownlist-fields> 
</ejs-dropdownlist> 


Screenshot:


 
 

Kindly integrate the provided solution with your application and get back to us if you need any further assistance on this. 

Regards, 
Jeyanth. 


Marked as answer

AB Andrei Badescu January 9, 2024 12:57 PM UTC

Hello There, 

I'm having an issue while trying to preselect a value in a custom edit page. 

My viewbag looks like this: 

ViewBag.Depozit = await _context.tWDepozites.Where(x => x.aWDepoID == document.iWDocDepozit).Select(x => new { ID = x.aWDepoID, Text = x.sWDepoName }).ToListAsync();


My dropdownlist code:

  <ejs-dropdownlist id="iWDocDepozit" dataSource="@ViewBag.Depozit" placeholder="Depozit" floatLabelType="Always" popupHeight="300px" ejs-for="iWDocDepozit" required>

      <e-dropdownlist-fields text="Text" value="ID"></e-dropdownlist-fields>

  </ejs-dropdownlist>


The viewbag only contains one item and the datasource works properly.

How can i preselect that item? 

Thank you!



KP Kokila Poovendran Syncfusion Team January 29, 2024 12:17 PM UTC

Hi Ssekamatte James,


Thank you for reaching out with your query about preselecting a value in a custom edit page.


We've examined your requirements and have prepared a sample code snippet that should address your needs:


<ejs-dropdownlist id="dropdown" name="Value" dataSource="ViewBag.Data" floatLabelType="Always" popupHeight="300px" ejs-for="@Model.Values" placeholder="Select a country">

    <e-dropdownlist-fields text="Vegetable" value="Id"></e-dropdownlist-fields>

</ejs-dropdownlist>

 

 

 

[HomeController.cs]

 

public IActionResult Index()

 {

     DropdownListValue model = new DropdownListValue();

     ViewBag.Data = new DropdownListValue().VegetablesList();

     model.Values = "item1";

     return View(model);

 }



In the provided code snippet, we've utilized a model to bind the preselected value. Please integrate these changes into your code and verify if they meet your requirements.


If you encounter any further issues or need additional assistance, please feel free to reach out.


Regards,

Kokila Poovendran.


Attachment: ASPCoreSamples_47f61f5b.zip

Loader.
Up arrow icon