Пользовательский интерфейс JQuery: как передать значения в диалог - PullRequest
Новая
       22

Пользовательский интерфейс JQuery: как передать значения в диалог

0 голосов
/ 01 июля 2011

Я очень новичок в JQuery UI.Я столкнулся с проблемой при загрузке модального диалогового окна с использованием JQuery.Здесь я пробую простой пример, который откроет диалог и загрузит новую страницу по событию onClick переключателя.Новая страница, которая загружается в диалоговое окно, является динамической страницей, которая получает некоторые значения из базы данных на основе данных пользователя, введенного через текстовое поле главной страницы.

Я не уверен, как передать значение текстового поляГлавная страница?Alsosd Я попытался передать значение текстового поля, добавив атрибуты url в url .. но не повезло :(из текстового поля. Это правильный путь? Предоставьте код ниже 

<!DOCTYPE html>

<html>
<head>  
    <script type="text/javascript" language="javascript" src="JS/jquery-1.6.1.js"></script>
    <script type="text/javascript" language="javascript" src="JS/jquery-ui-1.8.14.custom.min.js"></script>



<style type="text/css" title="currentStyle">
            @import "css/jquery-ui-1.8.4.custom.css";
        </style>    

    <script type="text/javascript">
        $(document).ready( function(){
            $("#CUSTOM").click( showDialog );
            //variable to reference window
            myWindow = $('#dialog');

            }
        );     
        //function to show dialog        
        var showDialog = function() {         
            //instantiate the dialog

            myWindow.load("regressionTestCustomMetadataSelection.action?consumer").dialog({ height: 350,
                            width: 400,
                            modal: true,
                            position: 'center',
                            autoOpen:false,
                            title:'Hello World',
                            overlay: { opacity: 0.5, background: 'black'}
            });

            //if the contents have been hidden with css, you need this         
            myWindow.show();          
            //open the dialog
            myWindow.dialog("open");
            }      
        //function to close dialog, probably called by a button in the dialog     
        var closeDialog = function() {
            myWindow.dialog("close");
            }
    </script>

  <script>




  function setSession()
  {
      $(document).ready(function() {
        $("#dialog").load("regressionTestCustomMetadataSelection.action?as").dialog({ modal: true, resizable: false, draggable: false, width: 515, height: 245 });
      });

      $("#dialog").dialog('open');
  }
  </script>
</head>
<body style="font-size:62.5%;">
 <div>
                                        <input type="radio" name="submittedMetadataSelection" id="DEFAULT" value="DEFAULT" checked/>
                                        <label for="DEFAULT">DEFAULT</label>

                                        <input type="radio" name="submittedMetadataSelection" id="CUSTOM" value="CUSTOM" "/>
                                        <label for="CUSTOM">CUSTOM</label>

</div>
<div id="dialog" title="Dialog Title"></div>

</body>
</html>

1 Ответ

2 голосов
/ 01 июля 2011

Вместо «загрузки» попробуйте использовать метод $ .ajax и отправить параметры с объектом «данные»: 

$.ajax({
    url: "regressionTestCustomMetadataSelection.action",
    data: ({customer: "John"}),
    traditional: true,
    success: function(loadedData) {
        // assuming that the contents of loadedData is html
        myWindow.html(loadedData);
        myWindow.dialog();
    }
});
...