Search code examples
javascriptjquerybootstrap-4bootstrap-tokenfield

bootstrap tokenfiel delimiter '\n' (new line) copy and paste not working


I wanna copy and paste a list of values separated by: '\n' like this:
123
234
234
in my boostrap tokenfield, but when I set the delimiter to: '\n' it doesn´t work . this is my jquery configuration:

$('#res_pago').tokenfield({
    autocomplete :{
        source: function(request, response){
            $.ajax({
                  type : "POST",
                  url : "api/getResponsablePago",
                  data : {myData: request.term},
                  success : function(result) {
                      console.log(result);
                      var datas = [];
                      if(result.data != undefined){
                          result.data.forEach(element => datas.push({ value: element.responsableID, label: element.responsableID + " - " + element.responsableDes}));
                      }
                      response(datas);
                  }
            });
            
        },
        delay: 800,
    },
    showAutocompleteOnFocus: true,
    delimiter: [',','\n']
});

any idea?


Solution

  • I will answer my own question in case it is useful for someone else in the future:

    when I copy and paste a list separted by '\n' i don't now why the character '\n' is replaced by a simple space ' '. considering this, the answer is simply add the character space to de delimiters list like this:

     delimiter: ['\n',' ', ',']
    

    whole configuration for my example:

    $('#res_pago').tokenfield({
        autocomplete :{
            source: function(request, response){
                $.ajax({
                      type : "POST",
                      url : "api/getResponsablePago",
                      data : {myData: request.term},
                      success : function(result) {
                          console.log(result);
                          var datas = [];
                          if(result.data != undefined){
                              result.data.forEach(element => datas.push({ value: element.responsableID, label: element.responsableID + " - " + element.responsableDes}));
                          }
                          response(datas);
                      }
                });
                
            },
            delay: 800,
        },
        showAutocompleteOnFocus: true,
         delimiter: ['\n',' ', ',']
    });