将数据从 javascript 弹出多行文本框传输到选择控件

发布于 2025-01-05 23:21:07 字数 2689 浏览 2 评论 0原文

我正在尝试将数据从多行文本框传输到选择控件。 多行文本框显示为弹出窗口,我希望用户在弹出窗口中单击“提交”后,将粘贴在文本框中的所有记录传输到选择控件。 可能使用 jquery 或 javascript,或者其他东西。该页面是用 MVC3 Razor 构建的。 以下是页面中的代码:

弹出控件的脚本:

<script type="text/javascript">
    $(function () {
        $("a[id^=opener]").click(function () {
                    $("#dialog").dialog('destroy');
                    $("#dialog").attr("title", "Please paste your products")
                    .html("<p><textarea name=\"TextMessage\" rows=\"10\" cols=\"72\" /><br /><input type=\"submit\" value=\"Submit\" /></p>");

                    $("#dialog").dialog({
                        height: 420,
                        width: 650,
                        modal: true
                    });
        });

    });
</script>

.cshtml 页面:

@using (Html.BeginForm("ASPXView", "Report", FormMethod.Post)) {
    @Html.ValidationSummary(true, "Password change was unsuccessful. Please correct the errors and try again.")
    <div>
        @Html.Hidden("Id", Model.Report.Id)
        <div id="accordion">
        @{int i=0;}
            @foreach (var item in Model.Parameters)
            {
                <h3><a href="#">@Html.LabelFor(m => item.Name, item.Prompt)</a></h3>
                <div>
                    <div class="editor-label">
                        Search @*Html.TextBox("Search")*@ 
                        <input id="@("Search" + item.Name)" type="text" name="q" data-autocomplete="@Url.Action("QuickSearch/" + item.Name, "Report")" />
                    </div>

                    <div class="editor-field">
                        <select multiple id="@("Select" +item.Name)" name="@("Select" +item.Name)"></select>                           
                    </div>

                    <div class="removed" style="clear:both; float:left; margin-left:440px;">  
                     <a href="#" class="remove">Remove selection</a>   
                     <a id= "opener@(i)" class="OpenDialogClass" href="#" >Open Dialog</a>           
                    </div>    

                </div>
                i++;
            }         
        </div>
        <p style="text-align: right">
            <input type="submit" value="Generate Report" />
        </p>
    </div>
}
<div id="dialog" title="Basic dialog">
</div>

页面的屏幕截图:

输入图像描述这里

因此,将粘贴到弹出文本框中的数据,我希望在单击提交按钮后将其放在选择控件中。 知道我该怎么做吗? 提前致谢,拉齐亚莱

I am trying to transfer data from a multiline textbox to a select control.
The multiline textbox appears as a popup and I want all the records pasted in the textbox to be transferred to the select control once the user will click submit in the popup window.
Probably with jquery or javascript, or maybe something else. The page is built in MVC3 Razor.
Here is the code from the page:

The script for the popup control:

<script type="text/javascript">
    $(function () {
        $("a[id^=opener]").click(function () {
                    $("#dialog").dialog('destroy');
                    $("#dialog").attr("title", "Please paste your products")
                    .html("<p><textarea name=\"TextMessage\" rows=\"10\" cols=\"72\" /><br /><input type=\"submit\" value=\"Submit\" /></p>");

                    $("#dialog").dialog({
                        height: 420,
                        width: 650,
                        modal: true
                    });
        });

    });
</script>

The .cshtml page:

@using (Html.BeginForm("ASPXView", "Report", FormMethod.Post)) {
    @Html.ValidationSummary(true, "Password change was unsuccessful. Please correct the errors and try again.")
    <div>
        @Html.Hidden("Id", Model.Report.Id)
        <div id="accordion">
        @{int i=0;}
            @foreach (var item in Model.Parameters)
            {
                <h3><a href="#">@Html.LabelFor(m => item.Name, item.Prompt)</a></h3>
                <div>
                    <div class="editor-label">
                        Search @*Html.TextBox("Search")*@ 
                        <input id="@("Search" + item.Name)" type="text" name="q" data-autocomplete="@Url.Action("QuickSearch/" + item.Name, "Report")" />
                    </div>

                    <div class="editor-field">
                        <select multiple id="@("Select" +item.Name)" name="@("Select" +item.Name)"></select>                           
                    </div>

                    <div class="removed" style="clear:both; float:left; margin-left:440px;">  
                     <a href="#" class="remove">Remove selection</a>   
                     <a id= "opener@(i)" class="OpenDialogClass" href="#" >Open Dialog</a>           
                    </div>    

                </div>
                i++;
            }         
        </div>
        <p style="text-align: right">
            <input type="submit" value="Generate Report" />
        </p>
    </div>
}
<div id="dialog" title="Basic dialog">
</div>

Screenshot from the page:

enter image description here

So the data which will be pasted in the popup textbox, I would like to have it in the select control once the submit button is clicked.
Any idea how I can do that?
Thanks in advance, Laziale

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

初见 2025-01-12 23:21:07

您可以序列化文本区域的内容,然后对它执行您需要执行的操作(将其发布到控制器或将其传递到某个地方的底层页面)

$('form').submit(function(e){
   e.preventDefault();
   e.stopPropagation();

   var o = {};
   $( $('textarea').val().split(/\n|\r/) ).each(function(i){
      o[i] = this;
    });   
    var jsonString = JSON.stringify(o);   

    // DO SOMETHING WITH JSON OBJECT HERE
});​

You could serialize the contents of the textarea and then do what you need to do with it (Post it to a controller or perhaps hand it off to the underlying page somewhere)

$('form').submit(function(e){
   e.preventDefault();
   e.stopPropagation();

   var o = {};
   $( $('textarea').val().split(/\n|\r/) ).each(function(i){
      o[i] = this;
    });   
    var jsonString = JSON.stringify(o);   

    // DO SOMETHING WITH JSON OBJECT HERE
});​

http://jsfiddle.net/vUH3a/

他夏了夏天 2025-01-12 23:21:07

这会给你一个开始。

$("Button Selector").click(function(){
var SelectOptions= [];
        $("list Selector").each(function () {
            SelectOptions.push($(this).attr('id'));
        });
SelectOptions.each(function () {
            //build your mark up here and return
        });
});

This will give you a start.

$("Button Selector").click(function(){
var SelectOptions= [];
        $("list Selector").each(function () {
            SelectOptions.push($(this).attr('id'));
        });
SelectOptions.each(function () {
            //build your mark up here and return
        });
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文