Изменение значения разделения от "," до "-" (JS/JQuery)

Question

Я получил некоторый код JQuery для HTML. По существу, если флажок установлен, значение флажка помещается в поле ввода. Когда я сниму флажок, значение будет очищено от ввода. Однако, когда вы проверяете несколько флажков, «,» отделяет значения. Есть ли способ разделить значения на «-» вместо «,»? Я пробовал играть с кодом, и он просто нарушает код. Я довольно новичок в JS/Jquery, поэтому, если это простой ответ, я прошу прощения. При необходимости я могу предоставить дополнительную информацию. Работающий JSFiddle с "" здесь: https://jsfiddle.net/m240Laka/25/

Мой код находится здесь:

var $choiceDisplay = $("#choiceDisplay"), //jquery selector for the display box 
    $none = $("#none"), 
    $choice = $(".choice"); 

$choice.on("change", function() { 
    var $this = $(this), //jquery selector for the changed input 
    isThisChecked = $this.prop("checked"), //boolean true if the box is checked 
    choiceSelectionsArray = $choiceDisplay.val().split(",").filter(function(e){return e !== ""}), //array of values that are checked 
    isThisValueInDisplayedSelection = $.inArray($this.val(), choiceSelectionsArray) !== -1; //boolean true when $this value displayed 

if (isThisChecked) { 
    if (isThisValueInDisplayedSelection) { 
     return false; //odd, the value is already displayed. No work to do. 
    } else { 
     choiceSelectionsArray.push($this.val()); 
     $choiceDisplay.val(choiceSelectionsArray.join()); 
    } 
} else { //box has been unchecked 
    if (isThisValueInDisplayedSelection) { 
     choiceSelectionsArray = choiceSelectionsArray.filter(function(e){return e !== $this.val()}) 
     $choiceDisplay.val(choiceSelectionsArray.join()); 
    } 
} 
}); 

$none.on("change", function() { 
    var $this = $(this), 
    isThisChecked = $this.prop("checked"); 
if(isThisChecked){ 
    $choice.prop({ 
     disabled: true, 
     checked : false 
    }); 
    $choiceDisplay.val(""); 
}else{ 
    $choice.prop({disabled: false}); 
    return false; 
} 
}); 

Answer 1

В функциях join() и split(), вам необходимо сдать соответствующий разделитель, '-'. Я предлагаю создать локальную переменную, которую вы используете, поэтому ее легче изменить, если это необходимо.

var $choiceDisplay = $("#choiceDisplay"), //jquery selector for the display box 
    $none = $("#none"), 
    $choice = $(".choice"), 
    delimiter = '-'; 

$choice.on("change", function() { 
    var $this = $(this), //jquery selector for the changed input 
     isThisChecked = $this.prop("checked"), //boolean true if the box is checked 
     choiceSelectionsArray = $choiceDisplay.val().split(delimiter).filter(function(e){return e !== ""}), //array of values that are checked 
     isThisValueInDisplayedSelection = $.inArray($this.val(), choiceSelectionsArray) !== -1; //boolean true when $this value displayed 

    if (isThisChecked) { 
     if (isThisValueInDisplayedSelection) { 
      return false; //odd, the value is already displayed. No work to do. 
     } else { 
      choiceSelectionsArray.push($this.val()); 
      $choiceDisplay.val(choiceSelectionsArray.join(delimiter)); 
     } 
    } else { //box has been unchecked 
     if (isThisValueInDisplayedSelection) { 
      choiceSelectionsArray = choiceSelectionsArray.filter(function(e){return e !== $this.val()}) 
      $choiceDisplay.val(choiceSelectionsArray.join(delimiter)); 
     } 
    } 
}); 

Это jsfiddle.

Answer 2

В $ .join() добавьте параметр разделитель строки:

$choiceDisplay.val(choiceSelectionsArray.join("-")); 

UPDATE:

добавить то же самое в $ .split()

choiceSelectionsArray = $choiceDisplay.val().split("-")....