Generador de formularios jQuery con opciones clasificables

Estoy tratando de crear un módulo creador de encuestas usando jQuery que crea varios tipos de preguntas. Comenzando con una pregunta de opción múltiple que tendrá una pregunta y algunas opciones. He escrito el siguiente código.

$(function () {
    $("#sortable").sortable({

    });
});
$('#sortable3').sortable({
    //helper: 'clone',
    //placeholder: 'ui-state-highlight',
    //opacity: '.5',
    start: function (event, ui) {
        $(ui.item).show();
    }
});

(function () {
    $("#txt").live('click', function () {

        var $ctrl = $('<input type="text" name="inputtext" value="Enter Your Questions Here..."> <br /> <label>Required.? </label> <input type="checkbox" value="required"> <br /><input type="text" name="inputtext" value="Enter Notes Here..."> <br />').addClass("text");
        $("#holder").append($ctrl);

        var $options = $('<ul id="sortable3"><li>Item 1</li><li>Item 2</li><li>Item 3</li><li>Item 4</li><li>Item 5</li></ul>');

        $("#holder").append($options);
    });

})();

(function () {
    var i = 3;
    //var num = i++;
    $(".addChoices").live('click', function () {
        var $opt = $('<div id="div' + ++i + '" ><input type="text" name="inputtext" value="choice ' + i + ' " id="txt" + i++ +>  <span class="addChoices"> + </span>&nbsp; &nbsp; &nbsp; <span class="removeChoices" id="' + i + '"> - </span> </div>');
        $("#options").append($opt);

        //alert("Add");
    });

})();
(function () {
    $(".removeChoices").live('click', function () {
        alert("Getting Id " + $(this).attr('id'));
        var $idRem = $(this).attr('id');
        var div = $(this).attr('id');
        //alert("div"+div);
        var divId = "div" + div;
        $("#" + divId).remove();
    });

})();

HTML

<div style="display:inline">
  <input type="button" id="txt" value="Add Text Box" style= " " />
</div>
<div id="holder"> </div>
<div id="options"> </div>

Ahora, cuando hago clic en un botón, agrega la pregunta y algunas opciones. Puedo agregar o quitar opciones. Ahora quiero que las opciones se puedan ordenar para que el usuario pueda organizarlas en el orden en que quiere que aparezcan.

preguntado el 12 de junio de 12 a las 11:06

1 Respuestas

Hay complementos disponibles para este tipo de cosas:

http://jqueryui.com/demos/sortable/
http://farhadi.ir/projects/html5sortable/

Respondido 22 ago 12, 12:08

PD: no tengo suficiente representante para comentar sobre su pregunta, de lo contrario lo habría hecho. - mezclar

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.