{% load rapid_crud %}

<div class="rapid-select {{ id }} data reload-here">
    <input type="hidden" id="{{ id }}" name="{{ name }}" value="{{ value }}" {% for k, v in attrs %} {{ k }} = "{{ v }}" {% endfor %}>
    <span class="value-{{ id }}">{{ selected }}</span>
    <a class="rapid-select-search interaction"><span class="fa {{ icon }}"></span></a>
</div>
<script>
    function select_id_in_{{ id|jsid }}(source){
        var sel = source.find("table.rapid-object-selector");
        var marker = sel.children("tbody").children("tr.selected").children("td").children("input.rapid-select-id-marker");
        var new_id = marker.val();
        var new_name = marker.attr("name");
        $("input#{{ id }}").val(new_id);
        $("span.value-{{ id }}").text(new_name);
    };
    function search_{{ id|jsid }}(){
        show_overlay("{{ select_url }}", $("div.rapid-select.{{ id }}").find("a.rapid-select-search"), select_id_in_{{ id|jsid }});
    };
    $(document).ready(function(){
        var d = $("div.rapid-select.{{ id }}");
        d.find(".rapid-select-search").click(search_{{ id|jsid }});
    });
</script>