how to get checkbox value in bool to model in . net core. IsEnable value as array in serialize

Question

 public class AreaModel
 {
      public int AreaId { get; set; }
     public bool IsEnable { get; set; } = true;
 }

<form asp-area="MasterData" asp-controller="Home" asp-action="CreateUpdateArea" method="post">

    <div>
    @if (Model.AreaId != 0)
    {
        <div class="mb-3">
          <input asp-for="IsEnable" class="form-check-input" />
            <label asp-for="IsEnable" class="form-check-label">Enable</label>          
        </div>
    }
    <input asp-for="AreaId" type="hidden" />
    <div class="text-end">
        <button type="submit" class="btn btn-primary">Save</button>
    </div>
</form>

Answer 1

function serialize(data) {
    let obj = {};

    for (let [key, value] of data) {
        if (obj[key] !== undefined) {
            if (!Array.isArray(obj[key])) {
                obj[key] = [obj[key]];
            }

            obj[key].push(value);
        } else {
            obj[key] = value;
        }
    }
  

    return obj;
}

function bindFormContent(dialog, updateUrl, updateTargetId) {
    $('form', dialog).submit(function (e) {
        e.preventDefault();

        if (!$(this).valid()) {
            return false;
        }

        let formData = new FormData(this);
        let data = serialize(formData);

        // Find the submit button within the form
        var submitButton = $(this).find('button[type="submit"]');

        var initialText = submitButton.text();

        //Disable the submit button and change its text
        submitButton.prop('disabled', true).text('Processing...');

        fetchDataWithPost(this.action, data)
            .then((result) => {
                // process the data
        
            });

    });

    return false;
}

Answer 2

Hi @Mathu ,

I test your provided code, and use F12 to see the source tab, the data like:

Then in the CreateUpdateArea action:

 [HttpPost]
 public IActionResult CreateUpdateArea(AreaModel areaModel )
 {...//do your staff}

result:

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,

Qing Guo