0

Im using the following code to populate data to populate a DataTable with Ajax.

My problem is that i use AllowHtml (needed) when i save the company names to the database.

So my question is: How do i encode Title = asset.CompanyName so datatable dont get scripts/html like in the picture?

Some Name <b>alert("hmm")</b>

    // GET: Jsons/Customers
    public JsonResult Customers([ModelBinder(typeof(DataTablesBinder))] IDataTablesRequest requestModel)
    {

        Db db = new Db();

        IQueryable<CustomersDTO> query = db.Customers.Where(x => x.CompanyId == companyId);

        var totalCount = query.Count();

        #region Filtering
        // Apply filters for searching
        if (requestModel.Search.Value != string.Empty)
        {
            var value = requestModel.Search.Value.Trim();

            query = query.Where(p => p.Id.ToString().Contains(value.ToString()) ||
                                     p.CompanyName.Contains(value)

                               );
        }

        var filteredCount = query.Count();

        #endregion Filtering

        #region Sorting
        // Sorting
        var sortedColumns = requestModel.Columns.GetSortedColumns();
        var orderByString = String.Empty;

        foreach (var column in sortedColumns)
        {
            orderByString += orderByString != String.Empty ? "," : "";
            orderByString += (column.Data) + (column.SortDirection == Column.OrderDirection.Ascendant ? " asc" : " desc");
        }

        query = query.OrderBy(orderByString == string.Empty ? "Id asc" : orderByString);

        #endregion Sorting

        // Paging
        query = query.Skip(requestModel.Start).Take(requestModel.Length);


        var data = query.Select(asset => new
        {

            Id = asset.Id,
            //Allowing HTML for CompanyName
            Title = asset.CompanyName,
            Zip = asset.Zip,
            City = asset.City,
            Active = asset.Active

        }).ToList();

        return Json(new DataTablesResponse(requestModel.Draw,data, filteredCount, totalCount), JsonRequestBehavior.AllowGet);
    }

The code on page:

            var assetListVM; 
            $(function () { 
                assetListVM  =
                    { 
                    dt: null,
                        init:  function  ()
                        { 
                        dt = $('#assets-data-table').DataTable(
                            {
                                "language":
                                {
                                    "url": "/Scripts/plugins/dataTables/Swedish.json"
                                },
                                "serverSide": true, 
                                "processing": true, 
                                "ajax":
                                { 
                                    "url": "@Url.Action("Customers", "Jsons")",
                                    "data": function (d)
                                    {
                                        d.parameter1 = "Id";
                                        d.parameter2 = "Title";
                                    }
                                }, 

                                "columns":
                                [ 
                                    { "title": "Id", "data": "Id", "searchable": true }, 
                                    {
                                        "title": "Rubrik",
                                        "searchable": true,
                                        "data": null,
                                        "className": "class1 class2",
                                        "orderable": false,
                                        "render": function (data, type, row) {
                                            var someUrl = "/Admin/ShowCustomer/" + data.Id;
                                            return '<a href="' + someUrl + '" class="openEditor">' + data.Title + '</a>';
                                        }
                                    },
                                    { "title": "Postnr", "data":  "Zip",  "searchable":  true  }, 
                                    { "title": "Stad", "data":  "City",  "searchable":  true  }, 
                                    { "title": "Aktiv", "data": "Active", "searchable": true }
                                ],
                                "lengthMenu":  [[10,  25,  50,  100],  [10,  25,  50,  100]],
                            }); 
                        } 
                    } 

                // initialize the datatables 
                assetListVM.init(); 

            });
Katey
  • 141
  • 2
  • 6

1 Answers1

0

The problem is you are not HTML encoding the data.Title.

return '<a href="' + someUrl + '" class="openEditor">' + data.Title + '</a>';

should be replaced with:

return '<a href="' + someUrl + '" class="openEditor">' + htmlEncode(data.Title) + '</a>';

You will need to build your own htmlEncode implementation, or use this one.

mjwills
  • 21,750
  • 6
  • 36
  • 59