2013-02-07 1 views
0

안녕하세요, 저는 다중 선택 그리드로 선택할 수있는 JQuery Ui를 사용하고 있습니다. 나는 인덱스의 값을 사용 가능한 배열/객체로 가져 오는 방법을 이해할 수 없다. 나는 그것들을 값들과 함께 표시 할 수 있지만 그것들을 거기에서 꺼내려고 아무 쓸데없는 다른 것으로 끌어 내려고 노력했다. 나는이 문제를 조사하는 데 많은 시간을 할애했으며 비슷한 문제가있는 여러 사람들을 보았습니다.사용 가능한 배열로 JQuery Ui에서 인덱스 값 가져 오기

<!doctype html> 
<html class="" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en"><head> 
<title>Testing</title> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<meta http-equiv="Content-Language" content="en"> 
<meta name="language" content="en"> 


<link rel="stylesheet" href="css/phpMM.css"> 


    <script type="text/javascript" src="js/jquery.js"></script> 
    <script type="text/javascript" src="js/jquery_002.js"></script> 


<link rel="stylesheet" href="ui/jquery.ui.all.css"> 
<link rel="stylesheet" href="ui/demos.css"> 


    <script src="../jquery-1.8.3.js"></script> 
    <script src="js/jquery.ui.core.js"></script> 
    <script src="js/jquery.ui.widget.js"></script> 
    <script src="js/jquery.ui.datepicker.js"></script> 

    <script src="js/jquery.ui.position.js"></script> 
    <script src="js/jquery.ui.menu.js"></script> 
    <script src="js/jquery.ui.mouse.js"></script> 
    <script src="js/jquery.ui.button.js"></script> 

<link rel="stylesheet" href="ui/dropdown.css"> 

<link rel="stylesheet" href="ui/multiclicklist.css"> 
<script src="js/jquery.ui.selectable.js"></script> 

    <script src="js/jquery.dropkick-1.0.0.js" type="text/javascript" charset="utf-8"></script> 
     <link rel="stylesheet" href="ui/dropkick.css" type="text/css"> 

<style> 
    #Testing { list-style-type: none; margin: 0; padding: .25em; width: 450px; height: 185px;} 
    #Testing li { margin: 3px; float: left; width: 100px; height: 80px; font-size: 1.5em; text-align: center; } 
</style> 

<script type ="text/javascript"> 
    var apron = []; 

    $(function() { 
     $("#Testing").bind("mousedown", function(e) { 
      e.metaKey = true; 

    }).selectable(); 
    }); 

    $(function() { 
     $("#Testing").selectable({ 
      stop: function() { 
      var result = $("#click-result").empty(); 

      $(".ui-selected", this).each(function() { 
       var Pindex = $("#Testing li").index(this); 
       result.append(", " + (Pindex + 1)); 

       }); 

      } 

     }); 
    }); 

    (function showAlert() { 
     var WTF ="why dont it work"; 
     for (var i = 0; i < apron.length; i++){ 
      alert(apron[i]); 
     }; 
    }); 

</script> 

<body> 

     <p id="feedback"> 
      <span>You've selected:</span> <span id="click-result">none</span>. 
     </p> 

     <strong>&#149; Select Options? </strong> (select all that apply) 
      <ol id="Testing" class="multiclicklist"> 
       <li class="ui-state-default"value="1">Opt 1</li> 
       <li class="ui-state-default"value="2">Opt 2</li> 
       <li class="ui-state-default"value="3">Opt 3</li> 
       <li class="ui-state-default"value="4">Opt 4</li> 
       <li class="ui-state-default"value="5">Opt 5</li> 
       <li class="ui-state-default"value="6">Opt 6</li> 
       <li class="ui-state-default"value="7">Opt 7</li> 
       <li class="ui-state-default"value="8">Opt 8</li> 
      </ol> 

      <input type="button" value="CheckValue" onclick="showAlert();"> 
</body> 


</html> 
+1

코드는 www.tonyswoodshed.com – user2048239

답변

1

tonyswoodshed.com의 코드가 작동하지 않습니다,하지만 난 jsfiddle에 넣어했습니다.

이 부분은 http://jsfiddle.net/WDd9w/1/입니다.

+0

에서 볼 수 있습니다. 어레이에 배치 한 것처럼 보이기 때문에 고맙게 여깁니다. – user2048239