Dynamically set URL of datatables editor create / update / delete

Dynamically set URL of datatables editor create / update / delete

cougarkevincougarkevin Posts: 7Questions: 4Answers: 0

I am trying to dynamically set the ajax url's for the datatables editor via a call to a function. The following works:

create: {
    "url": "http://10.20.40.60/api/",

But this does not work:

create: {
    "url": getUrl(),
...
function getUrl() {
    return "http://10.20.40.60/api/"
}

Any thoughts on how I do this?

Best Wishes,

ks

This question has an accepted answers - jump to answer

Answers

  • tangerinetangerine Posts: 3,365Questions: 39Answers: 395
    edited August 2017

    Posted in error - sorry.

  • allanallan Posts: 63,252Questions: 1Answers: 10,420 Site admin
    Answer ✓

    The problem with using "url": getUrl(), is that getUrl() is executed at the time when the Editor is initialised. I'm guessing that isn't what you want.

    Editor doesn't really have a way to dynamically change the target URLs assigned to it, and I don't believe jQuery allows url as a function (although that would be useful in this case!) - so what you would need to do is use ajax as a function and provide your own $.ajax call to the server. That will give you the option of executing getUrl() dynamically.

    If it doesn't need to be dynamic - i.e. it always returns the same static string, the above should actually work - although you would want to define getUrl() before you use it.

    Allan

  • cougarkevincougarkevin Posts: 7Questions: 4Answers: 0
    edited August 2017

    Allan,

    Thanks for you help. We just purchased a license to datatables and I'm expected to get this up and running asap!

    For the next person who wants to do this with a REST service here is the code that worked for me. For the delete, we pass a string of ID's to the REST service.

    getUrl() returns the endpoint of the service.
    POST to add a record
    PUT to edit a record
    DELETE to delete one or more records

    editor.on('preSubmit', function (e, data, action) {
    // CREATE A RECORD
        if (action == "create") {        
            $.ajax({ 
                type: 'POST', 
                url: getUrl(), 
                contentType: "application/json",
                dataType: 'json',               
                data: JSON.stringify(data.data[0])
            })
        }
    // EDIT A RECORD
    // THE FORMAT OF DATA.DATA IS THE ID OF THE ROW WITH THE VALUES AS A DICT
    // { 25 : { name : "name" } }
        else if (action == "edit") {
            for(var row in data.data){
                var id = row
                var values = data.data[row];
            }
            $.ajax({ 
                type: 'PUT', 
                url: getUrl() + id, 
                contentType: "application/json",
                dataType: 'json',               
                data: JSON.stringify(values)
            })              
        }
    // DELETE ONE OR MORE RECORDS
    // THE FORMAT OF DATA.DATA IS THE ID OF THE ROW WITH THE VALUES AS A DICT
    // { 25 : { name : "name" } }
    // SO WE LOOP THROUGH THE ROWS GETTING THE IDS
        else if (action == "remove") {
            ids = [];
            for(var row in data.data){
                ids.push(row);
            }
            $.ajax({ 
                type: 'DELETE', 
                url: getUrl() + ids.join(","), 
                contentType: "application/json",
                dataType: 'json',               
                data: []
            })              
        }
    
This discussion has been closed.