My function is not returning all checked Values

Question

I am populating list of checkboxes on Ajax call and I am trying to get which checkboxes are been checked and I am getting only first value. Please help me if I am doing any wrong.

My Html:

<%@ Control Language="C#"Inherits="System.Web.Mvc.ViewUserControl<EmsAdmin.Models.User>" %>
<%= Html.ValidationSummary("Edit was unsuccessful. Please correct the errors andtryagain.") %>
<% using (Html.BeginForm(null, null, FormMethod.Post, new { name = 
"VerficationForm", id = "VerficationForm" }))
 {%>
<%= Html.AntiForgeryToken() %>
<%: Model.Id %>
<h2>Go For All / Individual Brands</h2>
<p>
<input type="checkbox" id="checkBoxAllSelect" class="checkBoxAllSelect" value="All" />
All
<br />
<input type="checkbox" id="checkBox1Individual" class="checkBox1Individual" 
 value="Individual" />
 Individual
<br/>
 <input type="button" value="GetBrands" class="getBrands" />
</p>
<hr />
<h2>Multi Select Brands If Required:</h2>
 <div id="checkboxes" class ="divNewBrandsList">
 </div>
 <hr />
<h2>Countires For Each Brand:</h2>
<div id="checkboxescountries" class="divNewCountriesList">
 </div>
 <hr />
 <% } %>

Script:

 <script type="text/javascript">
 $('.getBrands').hide();
function myBrandsfunction() {
    var selectedBrands = "";
    var manu = "";
    var input = "";
    $("#checkboxes input:checked").each(function () {
        manu = $(this).val();
        alert("Brand value:" + manu); // Here I am getting only one Selected checkbox but not all.
        selectedBrands = selectedBrands + "," + manu;
        alert("Selected brands:" + selectedBrands);
        var productInput = "";
        var myUrl = "/Countries/GetCountiresForManufacturer/" + selected + "/" + input;
        $.ajax({
            url: myUrl,
            type: 'get',
            success: function (data) {
                productInput = data;
                $(".divNewCountriesList").html(productInput);
            }
        });
    });
}

Controller:

    /// <summary>
    /// GetBrands for Organisation
    /// </summary>
    /// <returns></returns>
    [Authorize(Roles = "Administrator")]
    [AcceptVerbs(HttpVerbs.Get)]
    public string GetBrandsForOrganisation(string organisation)
    {
        var sb = new StringBuilder();
       // var brandsList = new List<String>();
        if (organisation == null)
        {
            return "";
        }
        else
        {
            var corporation = _corporationRepository.GetCorporationByName(organisation);
            if (corporation != null)
            {
                // Get Manufactuerers 
                var brands = _corporationManufacturerRepository.GetAllManufacturersForCorporation(corporation.Id);

                sb.Append("<div id = \"" + organisation + "\">");
                foreach (var brand in brands)
                {
                    sb.Append("<input id =\"" + brand.Manufacturer.Id +
                              "\" type=\"checkbox\" class=\"checkboxBrand\" value=\"" +
                              brand.Manufacturer.Description + "\"/>" + brand.Manufacturer.Description);
                    sb.Append("<br />");
                }
                sb.Append("<br />");
                sb.Append("</div>");
            }

        }
        sb.Append("<input type=\"button\" value=\"GetCountries\"  onclick = \"myBrandsfunction()\"class=\"brands\"/>");

        return sb.ToString();
    }

Can you please try and narrow down your code to exactly where the error is occurring, people aren't likely to sieve through all of that code to find something wrong. — Richard Dalton, Sep 13 '13 at 14:31

score 0 · Answer 1 · edited May 23 '17 at 12:28

I believe the problem you are having is that it is updating all, but only the last one is alive, because you continuously replace the html of .divNewCountriesList with your last response. You probably need to build an array/long string:

var checkedItems = $("#checkboxes input:checked");

var productInputList = []; 

checkedItems.each(function (index,element) {
    manu = $(this).val();
    alert("Brand value:" + manu); // Here I am getting only one Selected checkbox but not all.
    selectedBrands = selectedBrands + "," + manu;
    alert("Selected brands:" + selectedBrands);
    var productInput = "";
    var myUrl = "/Countries/GetCountiresForManufacturer/" + selected + "/" + input;


    $.ajax({
        url: myUrl,
        type: 'get',
        success: function (data) {
            productInput = data;
            productInputList.push(productInput);
            if (index == checkedItems.length - 1) {
                //Reached end of list... populate
                $(".divNewCountriesList").html(productInputList.join(' '));
            }
        }
    });
});

Alternatively you could use deferred as suggested here to avoid the messy index check/be awesome.

@J Torres Thanks for the post. But I am not getting values. What I am expecting is if checkedItems are Dove,Sure my manu should be Dove then selected = ,Dove and next Sure manu = sure and Selected = ,Dove,Sure that is the result I am expecting but now I am just getting Dove and my url as well null. — Achieve Solution, Sep 13 '13 at 15:41

Hackerman · Answer 2 · 2013-09-13T15:10:08.217

0

May be the problem is:

You have a:

$("#checkboxes input:checked")

....but your div looks like...

<div id="checkboxes" class ="divNewBrandsList">

It's an id matter...try changing the id of the checkboxes.

=====================UPDATE======================

This too seems odd:

 //This line is storing just one value and its normal
 manu = $(this).val();

But the important part is the .ajax call inside the foreach loop, just, why?? ...the input get value in the url is empty too.

Here:

var myUrl = "/Countries/GetCountiresForManufacturer/" + selected + "/" + input;

edited Sep 13 '13 at 15:10

answered Sep 13 '13 at 14:52

Hackerman

12,139
2
34
45

I thought that was the issue at first as well, but I believe we're not seeing the code that injects the output of `GetBrandsForOrganisation` into `#checkboxes` – Jaime Torres Sep 13 '13 at 14:54

My function is not returning all checked Values

2 Answers2