[Solved] Display specific value in DropDownList

[Deise]

Hello;
I have a form and inside it I have a DropDownList. When I'll edit an object I must to set the value of a DropDownList, but, it's not working very well. The value is setted but it just is shown when I click in the DropDownList. I need to show the value when the edit form is shown, not when I click in the DropDownList.
This is my form and dropdownlist:

@model ViewModel.GrupoViewModel

<form id="FormIncluir" action="/Grupo/Incluir" method="post" class="form_validation_ttip">
     @(Html.Telerik().DropDownList()
       .Name("perfil").HtmlAttributes(new { Name = "perfil", Style = "margin:4px;width:201px;float:left" })
       .DataBinding(binding => binding.Ajax().Select("GetPerfis", "Util"))
       .Value(Model.perfil))
</form>

Controller Util (GetPerfis)

public JsonResult GetPerfis()
{
    List<string> lista = new List<string>();

    lista.Add("Analista");
    lista.Add("Gestor");

    return new JsonResult
    {
        Data = new SelectList(lista)
    };
}

Any suggestions?
I also have another problem. I'm using a jquery plugin to validate this field (http://docs.jquery.com/Plugins/Validation#Validator). This DropDownList is required and that plugin is not validating this field correctly.
This is the way that I'm using to validate:

rules: { perfil: {  required: true } },

It is working for another fields, like input, but is not working for a DropDownList.
Why this is happening?

[CD]

I need this solution as well. I'm facing the same problem. I need the 0 index of the dropdown automatically selected. I need the dropdown to fill automatically, not when clicked.

[Deise]

Hi;
The only solution that I found was add the OnLoad method in the DropDownList.
This is my final code:

//View
@(Html.Telerik().DropDownList()
    .Name("perfil").HtmlAttributes(new { Name = "perfil", Style = "margin:4px;width:201px;float:left" })
    .DataBinding(binding => binding.Ajax().Select("GetPerfis", "Util"))
    .ClientEvents(events=> events.OnLoad("OnLoadPerfil"))
    .Value(Model.perfil))

//JQuery File
function OnLoadPerfil(){
    $(this).data('tDropDownList').reload();
}

When your page will, your DropDownList will load as well. So, you don't need to click to load your field.
If you want to set an initial value, maybe you can do this.

function OnLoadPerfil(){
    $(this).data('tDropDownList').reload();
    $(this).val(0);
}

I don't know if this will work because I didn't try this way, ok!?
I hope this help you.

Best Regards;
Deise.

[CD]

Thanks, but no this doesn't quite work. I'm getting conflicts between OnLoad and OnChange.. I need to load the dropdownlist and select the first item, but selecting it fires the OnChange. And I need the OnChange to ge the new value and then refresh the page based on the newly selected item. It ends up in an endless loop. So I set a flag for the initial load so that the OnChange won't fire endlessly. But when i select a different item and the page refreshes, the newly selected item isn't selected because the OnLoad ran and the first item is still selected.

This is the code I'm using:

@(Html.Telerik().DropDownList()
.Name("Branches")
.DataBinding(binding => binding.Ajax().Select("_GetSchoolBranches", "School"))
.ClientEvents(events => events
.OnDataBinding("onBranchesDataBinding")
.OnChange("onBranchChange")
.OnLoad("onLoadBranches"))
.HtmlAttributes(new { @class = "BranchDropDown" })
)

var initialLoad = false;

function onBranchChange() {
if(!initialLoad) {
window.location = '@Url.Action("SchoolIndex", "School", new {id = ""})' + '/' + $(this).val();
}
initialLoad = false;
}

function onBranchesDataBinding(e) {

    e.data = $.extend({}, e.data, { schoolID: $('#SchoolID').val() });

}

function onLoadBranches() {

    initialLoad = true;

    $('#Branches').data('tDropDownList').reload();

}

[Deise]

If you don't use the OnLoadBraches, your DropDownList just will bind when you click in the DropdownList. On this time, the OnBrancheChange will called.
In my case, I have a typed view, so when the page is loaded I set the value of the DropDownList.

//DropDownList
Value(Model.perfil)

When you're using a typed view, you can do something like that:

//Controller
public ActionResult Index()

{

     NameOfView vm = new NameOfView();

     vm.id = 0; //Your attribute which refers to dropdownlist

     return View(vm);

}

So, when your page will loaded, the method OnLoadBranches will called, and your model will has the value of your dropdownlist.
I think it will work.

[CD]

Right, but I don't want the user to have to click the dropdownlist just to get it to load, it should already be loaded with values to select from. That's just normal behavior, having to click to get it to load is very poor user experience