Selectpicker с добавлением или удалением значений

Question

У меня есть загрузочный selectpicker. У меня есть список значений timeRange.

<select class="selectpicker"> 

<option data-icon="" value="00:00-23:59">All Day (12am-11:59pm)</option> 
<option data-icon="fa fa-coffee" value="05:00-08:59">Morning (5am-8:59am)</option> 
<option data-icon="fa fa-briefcase" value="09:00-16:59">Business Hours (9am-4:59pm</option> 
<option data-icon="fa fa-moon-o" value="17:00-20:59">Evening (5pm-8:59pm)</option> 
<option data-icon="fa fa-clock-o" value="00:00-11:59">AM Hours (12am-11:59am)</option><option data-icon="fa fa-clock-o" value="12:00-23:59">PM Hours (12pm-11:59pm)</option><option data-icon="fa fa-clock-o" value="00:00-05:59">12am-5:59am</option> 
<option data-icon="fa fa-clock-o" value="06:00-11:59">6am-11:59am</option> 
<option data-icon="fa fa-clock-o" value="12:00-17:59">12pm-5:59pm</option> 
<option data-icon="fa fa-clock-o" value="18:00-23:59">6pm-11:59pm</option> 

</select> 

USECASE: Я хочу, чтобы добавить или удалить некоторые из них и отправить получившийся JSON бакэнду.

Это то, что я пробовал:

http://jsfiddle.net/M69TH/18/ 

У меня есть кнопка под названием «Удалить» по существу, если я нажимаю, я хочу, чтобы удалить один из timeRanges из selectpicker и повторно отправить JSON к серверу.

Как я могу это достичь?

Answer 1

Это будет работать для удаления выбранного элемента образуют selectpicker:

function modifications() { 
    $('.selectpicker option:selected').remove(); 
    $('.selectpicker').selectpicker('refresh'); 
} 

Для отправки JSON бакэнду:

function send() { 
    var jsonData = { 
     name: "value"; //change this according to your needs 
    } 

    $.ajax({ 
     url: 'backend url', //change this 
     type: 'post', 
     dataType: 'json', 
     success: function (data) { 
      // any msg you want to display on success 
     }, 
     data: jsonData 
    }); 
}