【问题标题】:Getting a value from textarea that is inside of a foreach loop从 foreach 循环内的 textarea 获取值
【发布时间】:2017-06-15 20:53:02
【问题描述】:

所以,事情是这样的——我有一个使用foreach 循环生成的评论部分,所有 cmets 都有按钮单击,这将导致引导模式打开并使用 textarea 输入回复评论。 问题是我只能从页面上的第一条评论中获取价值,我尝试使用 JS 来获取价值 - var comment = $('#textarea_id').val(); 并且仅使用 PHP ($_POST) 但它仅适用于第一条评论。它还尝试为每个文本区域、唯一名称等设置唯一 ID,但它也无济于事。 这是一些用于视觉理解的代码(请注意,我使用的是 smarty 引擎,但我认为它与常规 PHP foreach 循环中的逻辑相同,所以不要介意):

{foreach from=$comments item=row}
Here is the body of comment and button to trigger reply modal
And this is reply modal with textarea in it:
            <!-- Reply Modal -->
            <div class="modal fade" id="{$row.id}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content" style="word-wrap:break-word;">
                        <div class="modal-header love-modal">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h3 class="modal-title" id="myModalLabel">Reply to <a href="{$abslink}profile/{$row.username}">{$row.username}</a></h3>
                        </div>
                        <div class="modal-body">
                            <form class="form-horizontal" role="form" action="#" method="post">
                            <textarea class="form-control" id="someidfortextarea" name="" rows="8" maxlength="5550"></textarea>
                            </form>
                         </div>
                        <div class="modal-footer">
                            <button class="reply btn btn-success" name="submit" type="submit">Post</button>
                            <button type="button" class="btn btn-success" data-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>
            {/foreach}

所以,主要问题是 - 如何从 foreach 循环中的 textarea 获取文本(通过 php 或 javascript)?我很高兴看到任何建议或建议!非常感谢你!

【问题讨论】:

  • 你也可以发布你的javascript吗?
  • 现在我只是出于调试目的将值记录到浏览器的控制台,但即使是关于我的 JS 代码,它也可能与我尝试获取值的方式有关。 $(function() { $(".reply").click(function() { var comment = $('#comment').val(); var topic_id = $('#topic_id').val(); // get the page id from the hidden topic_id field var dataFields = {'comment': comment, 'topic_id': topic_id}; // prepare datas string console.log(comment); console.log(dataFields); }); });

标签: javascript php jquery html foreach


【解决方案1】:

您需要一个共享标识符来将按钮与匹配的文本区域相关联。 $row.id 似乎很合适。

免责声明:未经测试的代码,因此您可能需要对其进行一些修改才能使其正常工作。

{foreach from=$comments item=row}
    ...
    <textarea class="form-control" id="textarea_{$row.id}" name="" rows="8" maxlength="5550"></textarea>
    ...
    <button id="submit_post_{$row.id}" class="reply btn btn-success" name="submit" type="submit">Post</button>
    ...
{/foreach}

然后在您的 javascript 中,您可以将其关联回来:

$('button.reply').click(function() {
    var button_id = $(this).prop('id');
    var row_id = button_id.replace('submit_post_', '');
    var textarea_id = '#textarea_' + row_id;

    var comment = $(textarea_id).val();

    // now send {comment} to the server using ajax
});

我确信有更有效的方法可以做到这一点,也许您可​​以在按钮上使用data 属性,这样您就不必对按钮的id 进行字符串替换。这只是一个大概的想法。

【讨论】:

  • 嗯,老实说,我也没有尝试为按钮设置唯一 ID,感谢您的提示。我觉得我们已经很接近了,但现在我收到一个错误:Uncaught TypeError: Cannot read property 'replace' of undefined 我会继续努力,我相信它几乎解决了
  • 根据 jQuery 版本,您可能需要使用 attr 而不是 prop 从按钮获取 id。
  • 这是 jQuery v3.1.1 我现在试试attr
  • Uncaught TypeError: button_id.attr is not a function - 这让我很沮丧
  • 啊,等等,对不起,我搞糊涂了。是的,道具实际上工作正常,已经检查过它正在替换
猜你喜欢
  • 2016-12-31
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-06-28
相关资源
最近更新 更多