CRM点击多选框——第23天
在table_objs_change.html:
<form class="form-horizontal" method="post" onsubmit="return SelectAllChosenData()">{% csrf_token %}
<div style="color: red">{{form_obj.errors}}</div>
{% for filed_form in form_obj%}
<div class="form-group">
<label class="col-sm-2 control-label" style="font-weight:normal">
{% if filed_form.field.required%}
<b>{{filed_form.label}}</b>
{% else %}
{{filed_form.label}}
{% endif %}
</label>
<div class="col-sm-10">
{#<input type="email" id="inputEmail3" placeholder="{{filed_form}}">#}
{% if filed_form.name in admin_class.filter_horizontal%}
<div class="col-lg-5">
{% get_m2m_choose_data admin_class filed_form form_obj as m2m_obj_list%}
<select multiple class="filter-select-box" id="id_{{filed_form.name}}_from">
{% for m2m_obj in m2m_obj_list%}
<option ondblclick="MoveElementTo(this,'id_{{ filed_form.name }}_to','id_{{ filed_form.name }}_from')" value="{{m2m_obj.id}}">{{m2m_obj}}</option>
{% endfor %}
</select>
</div>
<div class="col-md-1">
箭头
</div>
<div class="col-lg-5">
{% get_m2m_selected_obj filed_form form_obj as m2m_seleced_list %}
<select tag="chosen_list" multiple class="filter-select-box" id="id_{{filed_form.name}}_to" name="{{filed_form.name}}">
{% for m2m_selected_obj in m2m_seleced_list %}
<option ondblclick="MoveElementTo(this,'id_{{ filed_form.name }}_from','id_{{ filed_form.name }}_to')" value="{{m2m_selected_obj.id}}">{{m2m_selected_obj}}</option>
{% endfor %}
</select>
</div>
{% else %}
{{filed_form}}
{% endif %}
</div>
</div>
{% endfor %}
<div class="form-group">
<button type="submit" class="btn btn-success pull-right" >SAVE</button>
</div>
</form>
<script>
function MoveElementTo(ele,target_id,new_target_id) {
var opt_ele = "<option value='" + $(ele).val() + "' ondblclick=MoveElementTo(this,'" + new_target_id +"','"+ target_id +"')>" + $(ele).text() + "</option>";
// $(ele).off().dblclick($(ele), parent_id)
$("#" +target_id).append(opt_ele);
$(ele).remove();
}
function SelectAllChosenData() {
$("select[tag='chosen_list'] option").each(function () {
$(this).prop("selected",true);
})
return true;
}
</script>