2017-08-10 5 views
1

私は剣道のマルチセレクションを使用しています。デフォルトで返される値は、選択した値のカンマ区切りの値です。私はコンマの間にスペースを入れて、より読みやすい形式でこれを表示したいと思います。私のコード....剣道多項値はカンマ+スペースでカンマを置き換えます

http://dojo.telerik.com/OcIxEw

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Kendo MultiSelect replace comma with comma space</title> 

    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.common.min.css"> 
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.rtl.min.css"> 
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.default.min.css"> 
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.mobile.all.min.css"> 

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="http://kendo.cdn.telerik.com/2016.1.112/js/angular.min.js"></script> 
    <script src="http://kendo.cdn.telerik.com/2016.1.112/js/jszip.min.js"></script> 
    <script src="http://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script></head> 
<body> 

    <select id="msCity" multiple="multiple" data-placeholder="Select Cities" > 
    <option>Chicago</option> 
    <option>Las Vegas</option> 
    <option>Los Angeles</option> 
    <option>New Jersey</option> 
    <option>New York</option> 
    <option>San Francisco</option> 
    </select> 
    <br /> 
    <br /> 
    <button id="btnGet" type="button" onclick="btnGetClick()">Get Value</button> 
    <br /> 
    <br /> 
    <input id="result" type="text" style="width:100%" readonly /> 

    <script> 

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

      $('#msCity').kendoMultiSelect({ autoClose: false }); 

    //}); 

     function btnGetClick() { 
     var selectedCities = ""; 
     selectedCities = $('#msCity').data("kendoMultiSelect").value().toString(); 
     $('#result').val(selectedCities.replace(",", ", ")); 
     } 

    </script> 

</body> 
</html> 

は、残念ながら私の結果は任意の選択範囲の最初のカンマを置き換えます。

シカゴ、ニュージャージー、サンフランシスコシカゴ、ニュージャージー、サンフランシスコ 2番目(および後続のカンマ)は置き換えられません。

誰でも知っていますか?

答えて

2

残念ながら私の結果は、どの選択項目でも最初のカンマを置き換えます。あなたが変更することができ、あなたのパターンの出現をすべて置き換えるために

selectedCities.replace(",", ", ") 

へ:

selectedCities.replace(/,/g, ', ') 

スニペット:

$('#msCity').kendoMultiSelect({ autoClose: false }); 
 

 
function btnGetClick() { 
 
    var selectedCities = ""; 
 
    selectedCities = $('#msCity').data("kendoMultiSelect").value().toString(); 
 
    $('#result').val(selectedCities.replace(/,/g, ', ')); 
 
}
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.1.112/styles/kendo.common.min.css"> 
 
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.1.112/styles/kendo.rtl.min.css"> 
 
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.1.112/styles/kendo.default.min.css"> 
 
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2016.1.112/styles/kendo.mobile.all.min.css"> 
 

 
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 
 
<script src="https://kendo.cdn.telerik.com/2016.1.112/js/angular.min.js"></script> 
 
<script src="https://kendo.cdn.telerik.com/2016.1.112/js/jszip.min.js"></script> 
 
<script src="https://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script> 
 

 

 
<select id="msCity" multiple="multiple" data-placeholder="Select Cities" > 
 
    <option>Chicago</option> 
 
    <option>Las Vegas</option> 
 
    <option>Los Angeles</option> 
 
    <option>New Jersey</option> 
 
    <option>New York</option> 
 
    <option>San Francisco</option> 
 
</select> 
 
<br /> 
 
<br /> 
 
<button id="btnGet" type="button" onclick="btnGetClick()">Get Value</button> 
 
<br /> 
 
<br /> 
 
<input id="result" type="text" style="width:100%" readonly />

+0

ありがとうございました...私はいつもjQueryの.replaceがすべてのインスタンスを置き換えたと思っていましたが、それは最初に見つかったものではありません... .Replaceは.Net – Mych

関連する問題