How to add html input textbox, label, checkbox to jqery table

Question

I want to add some HTML tags to the rows of my jQuery table. Just understand how to do it.
I have shown a short part of my code here.
If any experienced would help me. I would benefit. thanks in advance...


@*index.cshtml*@






	
		
			Product ID
			Product Name
			Purchase Rate
			Qty
			value
			Checkbox

Accepted Answer

Hi @jewel,

Please check the sample code.

Index.cshtml

@{
    ViewData["Title"] = "How to add html input textbox, label, checkbox to jqery table";
}


 



    
    

    



    
        
            
                Product ID
                Product Name
                Purchase Rate
                Qty
                value
                Checkbox

PurchaseController.cs

using Microsoft.AspNetCore.Mvc;
using Newtonsoft.Json;

namespace signalr_iwa.Controllers
{
    public class PurchaseController : Controller
    {

        public IActionResult Index()
        {
            return View();
        }


        [HttpGet]
        public IActionResult GetProductRecord(int companyid)
        {
            // Dummy logic to get products by company id.
            // Replace with your actual data retrieval logic from the database.
            
            List mockData =  new List();

            for (int i = 1; i <= 10; i++)
            {
                Product p = new Product();
                p.ProductID = i;
                p.ProductName = "ProductName-" + i;
                p.PurchaseRate = new decimal(i);
                p.CompanyId = i;
                mockData.Add(p);
            }

            var products = new List(); ;

            if (companyid == 0)
            {
                products = mockData; // _context.Products.Where(p => p.CompanyId == companyid).ToList();
            }
            else {
                products = mockData.Where(a => a.CompanyId == companyid).ToList(); 
            }
           

            return Json(products);
        }

        [HttpPost]
        public IActionResult SubmitProducts([FromBody]List products)
        {
            try
            {

                int count = products.Count;

                // After processing the products, return a success response.
                return Ok(new { message = $"{count} products received." });
            }
            catch
            {
                // Handle errors appropriately. 
                // This is a basic error handling, make sure to provide specific error messages and logging as necessary.
                return BadRequest(new { message = "Failed to process products." });
            }
        }

    }
    public class Product
    {
        public int ProductID { get; set; }
        public string? ProductName { get; set; }
        public decimal PurchaseRate { get; set; }
        public int CompanyId { get; set; }
    }
    public class ProductDTO
    {
        public int ProductID { get; set; }
        public string? ProductName { get; set; }
        public decimal? PurchaseRate { get; set; }
        public int? Qty { get; set; }
        public decimal? TotalValue { get; set; }
        public bool? IsChecked { get; set; }
    }

}

You can move Product and ProductDTO to model folder.

Test Result
BlazorApp1

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,
Jason

Share via

How to add html input textbox, label, checkbox to jqery table

0 additional answers

Your answer