Thursday, October 27, 2022

[FIXED] How can I set a default value for Flexdatalist using jQuery

Issue

I am using Flexdatalist to provide auto completion functionality. My script is something like the following:

$('#locationKeyword').flexdatalist({
        url: 'serverAction',
        cache: false,
        searchIn: ["ProvinceName", "CityName", "TownName"],
        visibleProperties: ["ProvinceName", "CityName", "TownName"],
        groupBy: 'ProvinceName',
        value:'1,1,1',
        selectionRequired: false,
        focusFirstResult: true,
        minLength: 1,
        maxShownResults: 20,
        valueProperty: '{Value}',
        textProperty: '{ProvinceName}, {CityName}, {TownName}',
        searchContain: true
    });

The server side code(Asp.NET MVC) returns an array of objects like the following:

return Json(new
        {
            ProvinceName = item.Province.Name,
            CityName = item.City.Name,
            TownName = item.Town.Name,
            Value = item.ProvinceId + "," + item.CityId + "," + item.TownId
        });

All item.ProvinceId, item.CityId, item.TownId are int;

The problem: How can I set a default value for it. For example, I want to one combination of Province,City,Town to be selected.


Solution

Thanks all!

I found the solution as below:

Html:

<input name="BusinessLocation" type="text" class="locationKeyword" />

Script:

$('[name=BusinessLocation]').flexdatalist({
        url: options.businessLocationUrl,
        cache: false,
        searchIn: ["ProvinceName", "CityName", "TownName"],
        visibleProperties: ["ProvinceName", "CityName", "TownName"],
        groupBy: 'ProvinceName',
        selectionRequired: true,
        focusFirstResult: true,
        minLength: 1,
        maxShownResults: 20,
        textProperty: '{ProvinceName}, {CityName}, {TownName}',
        searchContain: true,
        valueProperty: 'Value'
    });        

    $('.locationKeyword').each(function (index) {
        if ($(this).hasClass('flexdatalist-alias')) {
            $(this).val('تهران, تهران, یوسف آباد');
        } else {
            $(this).val('1,1,1');
        }
    });

    $('[name=BusinessLocation]').val('1,1,1');


Answered By - Saeed Afshari
Answer Checked By - Dawn Plyler (PHPFixing Volunteer)

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.