MVC: Calling ajax data with different url parameter

MVC: Calling ajax data with different url parameter

dynasoftdynasoft Posts: 422Questions: 67Answers: 3

Hi

I have to call up ajax data with mvc parameters (ie different url) the values of which change based on the values users select from a select field. I notice that if I make another call to the same js function I used for initialising the editor, and pass it different values for intCdrFrmtSrc1, intCdrFrmtTpe1 and strCdrFrmtNme1 below the controller seems to show the same values that were used with the 1st initialising call.

            ajax: { //works
                url: '/CDRData/CRUDCDRDataAndFiles/' + intCdrFrmtSrc1.toString() + '/' + intCdrFrmtTpe1.toString() + '/' + strCdrFrmtNme1,
            },

How do I call up different ajax data again using mvc parameters in an url? Thanks

Answers

  • colincolin Posts: 15,142Questions: 1Answers: 2,586
    edited July 2019

    Hi @dynasoft ,

    Yep,

        url: '/CDRData/CRUDCDRDataAndFiles/' + intCdrFrmtSrc1.toString() + '/' + intCdrFrmtTpe1.toString() + '/' + strCdrFrmtNme1,
    

    will only use the values as they were when the table was initialised, effectively making them constants.

    If you make ajax.url a function, it will get the current values, something like:

        url: function() { return '/CDRData/CRUDCDRDataAndFiles/' + intCdrFrmtSrc1.toString() + '/' + intCdrFrmtTpe1.toString() + '/' + strCdrFrmtNme1},
    

    Cheers,

    Colin

  • dynasoftdynasoft Posts: 422Questions: 67Answers: 3

    Thanks! Will try that.

  • dynasoftdynasoft Posts: 422Questions: 67Answers: 3

    Hi

    Is this how this should be used:

    Replace:

        function CRUDCDRDataAndFiles1() {
    
            editor1 = new $.fn.dataTable.Editor({
    
                destroy: true,
                ajax: { //works
                    url: '/CDRData/CRUDCDRDataAndFiles/' + intCdrFrmtSrc1.toString() + '/' + intCdrFrmtTpe1.toString() + '/' + strCdrFrmtNme1,
                },
                table: ...,
                fields: [ ...]
            });
        }
    

    with:

        function CRUDCDRDataAndFiles1() {
    
            editor1 = new $.fn.dataTable.Editor({
    
                destroy: true,
                ajax: { //works
                    url: function() { return '/CDRData/CRUDCDRDataAndFiles/' + intCdrFrmtSrc1.toString() + '/' + intCdrFrmtTpe1.toString() + '/' + strCdrFrmtNme1},
                },
                table: ...,
                fields: [ ...]
            });
        }
    

    CRUDCDRDataAndFiles1 is called at and after initialisation.

    But I'm getting error Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:6301/CDRData/function()%20%7B%20return%20'/CDRData/CRUDCDRDataAndFiles/'%20+%20intCdrFrmtSrc1.toString()%20+%20'/'%20+%20intCdrFrmtTpe1.toString()%20+%20'/'%20+%20strCdrFrmtNme1%7D

  • allanallan Posts: 61,635Questions: 1Answers: 10,092 Site admin

    If you want to change the URL after initialisation you have to use ajax.url() to set the value.

    jQuery doesn't allow ajax.url to be a function. Colin was thinking of ajax which can be a function, but it sounds like you just want to change the URL, so ajax.url() is how to do it.

    Allan

  • colincolin Posts: 15,142Questions: 1Answers: 2,586

    Apologies for that, @dynasoft, I did think it could be a function. Note, you use ajax() to change Editor's URL.

    Cheers,

    Colin

  • dynasoftdynasoft Posts: 422Questions: 67Answers: 3

    Hi

    I had another issue and came up with a solution that fixes this as well:

                ajax: {
                    url: '/CDRData/CRUDCDRDataAndFiles/',
                    data: function ( d ) {
                        return $.extend( {}, d, {
                            intCdrFrmtSrc: intCdrFrmtSrc1,
                            intCdrFrmtTpe: intCdrFrmtTpe1,
                            strCdrFrmtNme: strCdrFrmtNme1
                        } );
                    },
                    type: 'POST',
                    async: true,
                    cache: false
                },
    

    Thank you for the help provided.

This discussion has been closed.