codice HTML:<head> <link href="assets/flatdoc/theme-white/style.css" rel="stylesheet"> <link type="text/css" href="base/ui.all.css" rel="stylesheet" /> <link href="multiple-select.css" rel="stylesheet"/> <script src="assets/jquery.min.js"></script> <script type="text/javascript" src="../../js/ui.core.js"></script> <script type="text/javascript" src="../../js/ui.resizable.js"></script> <script type="text/javascript" src="../../js/ui.draggable.js"></script> <script type="text/javascript" src="../../js/ui.dialog.js"></script> <script type="text/javascript" src="../../js/effects.core.js"></script> <script type="text/javascript" src="../../js/effects.highlight.js"></script> <script type="text/javascript" src="../../js/jquery.bgiframe.js"></script> <script src="jquery.multiple.select.js"></script> <script src="../../js/jquery_checkall_1_0_forjquery_1_4_2_head.js"></script> <style type="text/css"> body { font-size: 62.5%; } input.text, select { margin-bottom:12px; width:95%; padding: .4em; } form {margin-bottom: 25px;} fieldset { padding:0; border:0; margin-top:0px; } h1 { font-size: 1.2em; margin: .6em 0; } h2 { font-size: 1.0em; margin: .6em 0; text-align: center; font-weight: bold;} div#users-contain { width: 350px; margin: 20px 0; } div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; } div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; } .ui-button { outline: 0; margin:0; padding: .4em 1em .5em; text-decoration:none; cursor:pointer; position: relative; text-align: center; } .ui-dialog .ui-state-highlight, .ui-dialog .ui-state-error { padding: .3em; } </style> <script type="text/javascript"> $(function() { var time = $("#time"), refresh = $("#refresh"), penne = $("#penne"), allFields = $([]).add(time).add(refresh).add(penne), tips = $("#validateTips"); function updateTips(t) { tips.text(t).effect("highlight",{},1500); } function checkLength(o,n,min,max) { if ( o.val().length > max || o.val().length < min ) { o.addClass('ui-state-error'); //updateTips("Length of " + n + " must be between "+min+" and "+max+"."); updateTips("Devi selezionare almeno una penna "); return false; } else { return true; } } function checkRegexp(o,regexp,n) { if ( !( regexp.test( o.val() ) ) ) { o.addClass('ui-state-error'); updateTips(n); return false; } else { return true; } } $("#dialog").dialog({ bgiframe: true, autoOpen: false, height: 500, width: 600, modal: true, buttons: { 'Ok': function() { var bValid = false; allFields.removeClass('ui-state-error'); $("#time").change(function() { var selectVal3 = $('#time option:selected').val(); $('#form [name="time"]').val(selectVal3); }); $(this).find(':checked').each(function() { bValid=true; var name = $(this).attr('name'); $('#form [name="' + name + '"]').val(name); }); if (bValid) { $(this).dialog('close'); } }, Cancel: function() { $(this).dialog('close'); } } }); $('#create-user').click(function() { $('#dialog').dialog('open'); }) .hover( function(){ $(this).addClass("ui-state-hover"); }, function(){ $(this).removeClass("ui-state-hover"); } ).mousedown(function(){ $(this).addClass("ui-state-active"); }) .mouseup(function(){ $(this).removeClass("ui-state-active"); }); }); </script></head><body> <div class="demo"> <div id="dialog" title="Seleziona le Penne"> <form id='form'> <fieldset> <p id='e17'><label for="time">Trigger (minuti)</label> <select id="time" name="time" multiple="multiple"> <option value="30" selected>30</option> <option value="60" >60</option> <option value="90" >90</option> <option value="120" >120</option> </select> <script> $("select").multipleSelect({ single: true }); </script> </p><br> <p id='e17'><label for="refresh">Refresh (secondi)</label> <select multiple="multiple" name="refresh" id="refresh"> <option value="5" selected="true">5</option> <option value="10" >10</option> <option value="20" >20</option> <option value="30" >30</option> <option value="60" >60</option> </select> <script> $("select").multipleSelect({ single: true }); </script> </p> <br> <label for="penne">Penne</label> <fieldset> <table width="100%" class="ui-widget ui-widget-content"> <thead > <tr class="ui-widget-header "><td colspan="4"><h2>Linea 1</h2></td></tr> <tr class="ui-widget-header "> <th><input type="checkbox" class="parentCheckBox" /></th> <th>Tag</th> <th>Unità di Misura</th> <th>Descrizione</th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="A" class="childCheckBox" ></td> <td>A</td> <td>B</td> <td>C</td> </tr> <tr> <td><input type="checkbox" name="B" class="childCheckBox" ></td> <td>AA</td> <td>BB</td> <td>CC</td> </tr> </tbody> </table> </fieldset> </fieldset> </form> </div> <div id="users-contain" class="ui-widget"> <form id="form"> <div>form Tempo<input type="text" name="time" /></div> <div>form Refresh<input type="text" name="refresh" /></div> <div>form Box1<input type="text" name="A" /></div> <div>form Box2<input type="text" name="B" /></div> </form> </div> <button id="create-user" class="ui-button ui-state-default ui-corner-all">Create new user</button> </div><!-- End demo -->
Rispondi quotando