locked
How do change text in Dropdownlist ? RRS feed

  • Question

  • User1309263958 posted

    Hello guys. I have use Dropdownlist . I try change text in Dropdownlist , but i can not. Seem it losts some data .

    i.e : in Dropdownlist i have three data: AREA1,AREA2,AREA3, it load from ajax  .

     <select id="cbo_area"></select>
       function cb_area() {
                    $.ajax(
                    {
                        type: "POST",
                        url: "../BUS/WebService.asmx/LIST_AREA", //// get list all area
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (data) {
                            $("#cbo_area").html('');
                            $.each($.parseJSON(data.d), function (idx, obj) {
                                $("#cbo_area").append(
                                    '<option value="' + obj.AREA_ID + '">' + obj.AREA_NAME + '</option>');
                            });
                        },
                        error: function (data) {
                            alert("HTML Error Load Combo");
                        }
                    });
                }

    Ok, in my table , i click at row then click edit button, it will show data from row to Dropdownlist. it work but it only show one data , in this case "AREA2" (lost AREA1 and AREA3 in Dropdown) , i try click another row , i get that right , in this case "AREA3"  (lost AREA1 nad AREA2 in Dropdown), etc...

     $('#bt_edit').click(function (e) {
                        var DTO = {
                            'area_id': area_id_temp
                        };
                        $.ajax(
                        {
                            type: "POST",
                            url: "../BUS/WebService.asmx/AREA_NAME",  /// get name area follow id
                            data: JSON.stringify(DTO),
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            success: function (data) {
                                $("#cbo_area").html('');
    //cb_area(); // no work , it will loop data two times
    /// it only will one data in Dropdownlist $.each($.parseJSON(data.d), function (idx, obj) { $("#cbo_area").append( '<option value="' + obj.AREA_ID + '">' + obj.AREA_NAME + '</option>'); });
    //cb_area(); // no work, it will load wrong data }, error: function (data) { alert("HTML Error Load Edit"); } }); });

    I want to click a row in table , Dropdownlist will change text from row and concurrent with fields remaining data. i.e : when i click a row have "AREA1" , Dropdownlist text will change "AREA1" and more "AREA2" , "AREA3". Please give me some advice about this . Thank you.

    Tuesday, April 14, 2015 10:59 AM

Answers

  • User61956409 posted

    Hi headshot9x9,

    I will click a row 2 , then click edit button . In here text in dropdownlist need to change AREA2, AREA1,AREA3 . , If i click a row 4, then click edit button, text in dropdownlist need to change AREA3,AREA1,AREA2 ,...etc

    Would you like to dynamically set selected option? If that is the case, please refer to this sample.

    <div>
        <select id="cbo_area">
            <option value="1">AREA1</option>
            <option value="2">AREA2</option>
            <option value="3">AREA3</option>
        </select>
        <input id="btnset" type="button" value="Set" />
    </div> 
    
    <script>
        $(function () {
            $("#btnset").click(function () {
                $("#cbo_area").find('option[value="2"]').attr("selected", "selected");
            })
        })
    </script> 
    

    Best Regards,

    Fei Han



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, April 16, 2015 11:16 PM
  • User1309263958 posted

    Dear Fei Han,

    I soluted my problem is follow, in my function cb_area , It is working good.

     $("#cbo_area").html('');
                            $.each($.parseJSON(data.d), function (idx, obj) {
                                $("#cbo_area").append('<option value="' + obj.AREA_ID + '">' + obj.AREA_NAME + '</option>');
                            });
                            if (area_id_temp.length > 0) {
                                $("#cbo_area").val(area_id_temp);
                            }

    Best Regards

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, April 17, 2015 5:15 AM

All replies

  • User61956409 posted

    Hi headshot9x9,

    Thanks for your post.

    in my table , i click at row then click edit button, it will show data from row to Dropdownlist. it work but it only show one data , in this case "AREA2" (lost AREA1 and AREA3 in Dropdown) , i try click another row , i get that right , in this case "AREA3"  (lost AREA1 nad AREA2 in Dropdown), etc...

     $('#bt_edit').click(function (e) {
                        var DTO = {
                            'area_id': area_id_temp
                        };
                        $.ajax(
                        {
                            type: "POST",
                            url: "../BUS/WebService.asmx/AREA_NAME",  /// get name area follow id
                            data: JSON.stringify(DTO),
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            success: function (data) {
                                $("#cbo_area").html('');
                               //cb_area(); // no work , it will loop data two times
                               /// it only will one data in Dropdownlist
                                $.each($.parseJSON(data.d), function (idx, obj) {
                                    $("#cbo_area").append(
                                        '<option value="' + obj.AREA_ID + '">' + obj.AREA_NAME + '</option>');
                                });
                               //cb_area();  // no work, it will load wrong data
                            },
                            error: function (data) {
                                alert("HTML Error Load Edit");
                            }
                        });
    });

    According to your code, we could find that you pass “area_id” as a parameter to “AREA_NAME” method. If you retrieve area information base on the specific areaid, it will return only one record rather than an area list. So if you’d like to load all area information (area1, area2, area3) in dropdownlist, please don’t filter data by the specific areaid.

    Best Regards,

    Fei Han

    Tuesday, April 14, 2015 10:13 PM
  • User1309263958 posted

    According to your code, we could find that you pass “area_id” as a parameter to “AREA_NAME” method. If you retrieve area information base on the specific areaid, it will return only one record rather than an area list. So if you’d like to load all area information (area1, area2, area3) in dropdownlist, please don’t filter data by the specific areaid.

    Dear Fei Han. As I said above, I can load data into dropdownlist via cb_area function. I want to click on the row in the tables, data dropdownlist will change and additional the remaining fields.

    Example: Dropdownlist alway have three text data : AREA1, AREA2, AREA3.

    My table

    1   ABC       123      AREA1

    2   EFG        456     AREA2

    3   IJK          789     AREA1

    4   EFG         011    AREA3

    I will click a row 2 , then click edit button . In here text in dropdownlist need to change AREA2, AREA1,AREA3 . , If i click a row 4, then click edit button, text in dropdownlist need to change AREA3,AREA1,AREA2 ,...etc

    This means that text in dropdownlist will change according to the data of the line on the table, besides it must also other dataBest Regards.

    headshot9x9

    Wednesday, April 15, 2015 9:55 AM
  • User1309263958 posted

    Anybody some ideas ?

    Thank

    Thursday, April 16, 2015 10:02 PM
  • User61956409 posted

    Hi headshot9x9,

    I will click a row 2 , then click edit button . In here text in dropdownlist need to change AREA2, AREA1,AREA3 . , If i click a row 4, then click edit button, text in dropdownlist need to change AREA3,AREA1,AREA2 ,...etc

    Would you like to dynamically set selected option? If that is the case, please refer to this sample.

    <div>
        <select id="cbo_area">
            <option value="1">AREA1</option>
            <option value="2">AREA2</option>
            <option value="3">AREA3</option>
        </select>
        <input id="btnset" type="button" value="Set" />
    </div> 
    
    <script>
        $(function () {
            $("#btnset").click(function () {
                $("#cbo_area").find('option[value="2"]').attr("selected", "selected");
            })
        })
    </script> 
    

    Best Regards,

    Fei Han



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, April 16, 2015 11:16 PM
  • User1309263958 posted

    Dear Fei Han,

    I soluted my problem is follow, in my function cb_area , It is working good.

     $("#cbo_area").html('');
                            $.each($.parseJSON(data.d), function (idx, obj) {
                                $("#cbo_area").append('<option value="' + obj.AREA_ID + '">' + obj.AREA_NAME + '</option>');
                            });
                            if (area_id_temp.length > 0) {
                                $("#cbo_area").val(area_id_temp);
                            }

    Best Regards

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, April 17, 2015 5:15 AM