how to get the dynamic variable from the URL into the ajax url string?

how to get the dynamic variable from the URL into the ajax url string?

nickmabenickmabe Posts: 2Questions: 1Answers: 0

I'm a bit stuck, any help is gratefully received.

I’m opening a view with the following address: https://localhost:44322/Admin/Account/Details/3
At this point it has filtered out the account I’m looking for which has the Id 0f 3. It returns the relevant data. Also on the view is a Datatable which also needs to be filtered with the same ID.

}

the datatable calls the data as follows:

" function loadDataTable() {

dataTable = $('#tblData').DataTable({

"ajax": { "url": "/Admin/Account/DetailsByAccount" },

If I change it to:

function loadDataTable() {

dataTable = $('#tblData').DataTable({

"ajax": { "url": "/Admin/Account/DetailsByAccount?Id=3" },

I get all the related records for the Account with the ID of 3, just what I’m looking for.

I’ve tried everything I can find to get the dynamic variable from the URL into the ajax url string but the only thing I’ve got is a headache.

Any help is gratefully received.

full script:

var dataTable;

// Date renderer for DataTables from cdn.datatables.net/plug-ins/1.10.21/dataRender/datetime.js
// UMD
(function (factory) {
"use strict";

if (typeof define === 'function' && define.amd) {
    // AMD
    define(['jquery'], function ($) {
        return factory($, window, document);
    });
}
else if (typeof exports === 'object') {
    // CommonJS
    module.exports = function (root, $) {
        if (!root) {
            root = window;
        }

        if (!$) {
            $ = typeof window !== 'undefined' ?
                require('jquery') :
                require('jquery')(root);
        }

        return factory($, root, root.document);
    };
}
else {
    // Browser
    factory(jQuery, window, document);
}

}
(function ($, window, document) {

    $.fn.dataTable.render.moment = function (from, to, locale) {
        // Argument shifting
        if (arguments.length === 1) {
            locale = 'en';
            to = from;
            from = 'YYYY-MM-DD';
        }
        else if (arguments.length === 2) {
            locale = 'en';
        }

        return function (d, type, row) {
            if (!d) {
                return type === 'sort' || type === 'type' ? 0 : d;
            }

            var m = window.moment(d, from, locale, true);

            // Order and type get a number value from Moment, everything else
            // sees the rendered value
            return m.format(type === 'sort' || type === 'type' ? 'x' : to);
        };
    };


}));

$(document).ready(function ()
{
loadDataTable(

);

});
function getUrlVars()
{
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;

}

function loadDataTable() {
dataTable = $('#tblData').DataTable({
"ajax": { "url": "/Admin/Account/DetailsByAccount" },

        "order": [[0, "desc"]],

    "columnDefs": [{
        "targets": 'nosort',
        "orderable": false
    }],
     "columns": [

        {"data": "proposalReference", "width": "30%",

        render: function (data, type, row, meta) {
                if (type === 'display') {
                    data = '<a href="/Admin/Proposal/Details/' + row.proposalId + '">' + data + '</a>';
                }
                return data;
            }
        },
        {
            "data": "account.companyName", "width": "20%",

            render: function (data, type, row, meta) {
                if (type === 'display') {
                    data = '<a href="/Admin/Proposal/Account/' + row.accountId + '">' + data + '</a>';
                }
                return data;
            }





        },
        { "data": "proposalDate", "width": "20%", "text-align": "center",
            render: function (data, type, row) {
                if (type === "sort" || type === "type") {
                    return data;
                }
                return moment(data).format("Do-MMM-YYYY");
            }
        },
        { "data": "proposalCategory.proposalCategoryName", "width": "20%" },
        {
            "data": "proposalId", "width": "10%",
            "render": function (data) {
                return `
                        <div class="text-center">
                            <a href="/Admin/Proposal/Upsert/${data}"  style="cursor:pointer">
                                <i class="fas fa-edit fa-lg"></i> 
                            </a>&nbsp
                            <a onclick=Delete("/Admin/Proposal/Delete/${data}")  style="cursor:pointer">
                                <i class="fas fa-trash-alt fa-lg"></i>
                            </a>
                        </div>
                       `;
            }, "width": "40%"
        }
    ]
});

}

function Delete(url) {
swal({
title: "Are you sure you want to Delete?",
text: "You will not be able to restore the data!",
icon: "warning",
buttons: true,
dangerMode: true
}).then((willDelete) => {
if (willDelete) {
$.ajax({
type: "DELETE",
url: url,
success: function (data) {
if (data.success) {
toastr.success(data.message);
dataTable.ajax.reload();
}
else {
toastr.error(data.message);
}
}
});
}
});
}

Answers

  • nickmabenickmabe Posts: 2Questions: 1Answers: 0

    Sorted:

    {
    var url = window.location.href;
    var parts = url.split("/");
    var last_part = parts[parts.length - 1];
    };
    function loadDataTable() {
    dataTable = $('#tblData').DataTable({
    "ajax": { "url": "/Admin/Account/DetailsByAccount?ID=" + last_part},

This discussion has been closed.