3

如何将一个流体变量从控制器传递给 jQuery 或 JavaScript？

在我的控制器内部：

public function tabs () {
    $this->view->assign('tab', 1);
}

在流体内部，我将变量用作 {tab} 但如何传递给 JavaScript？任何帮助，将不胜感激...

4

6 回答 6

5

如果您需要像 f:for 这样的流体标签，您可以使用 CDATA（也可以使用流体变量）。例如

    <script type="text/javascript"><![CDATA[
            function initialize() {
                    var marker = [];
                    var LatLng;
                    var queryLatlng = new google.maps.LatLng(]]>{queryLat}, {queryLng}<![CDATA[);
                    var mapOptions = {
                            center: queryLatlng,
                            zoom: 8,
                            mapTypeId: google.maps.MapTypeId.ROADMAP
                    };
                    var map = new google.maps.Map(document.getElementById("tx_gmapplus-map"),mapOptions);

                    marker['0'] = new google.maps.Marker({
                            position: queryLatlng,
                            map: map,
                            title: "Standort"
                    });
                    ]]><f:for each="{addresses}" as="address" iteration="it"><![CDATA[
                            latlng = new google.maps.LatLng(]]>{address.txGmapplusLatitude}, {address.txGmapplusLongitude}<![CDATA[);
                            ]]>marker['{it.cycle}']<![CDATA[ = new google.maps.Marker({
                                    position: latlng,
                                    map: map,
                                    title: ]]>"{address.name}"<![CDATA[
                            });
                            ]]></f:for><![CDATA[
            }
]]></script>

写起来不太舒服，但它正在工作，并且您具有流体逻辑的优势。

于 2013-07-17T10:11:50.937 回答
5

我通常为此使用数据属性。所以在流体中你有这样的东西：

<div data-tab="{tab}"></div>

在您的 JavaScript 中，您可以通过以下方式访问此属性：

jQuery('div').data('tab');

当然，您可以为此使用任何 HTML 元素。

于 2013-11-01T13:34:56.940 回答
3

流体模板中的 JS 行为是......在大多数情况下很糟糕，如果您的 JS 代码包含任何大括号，则您需要包含外部脚本，而不是将脚本放在视图中。

原因是 Fluid 认为，所有大括号都属于它的范围，所以当你写的时候：

$('#mySelectBox').change(function() {
    // functions body code
    // next line
    // next line
});

Fluid 销毁 JS 并将其呈现为：

$('#mySelectBox').change(function() Array);

然后我经常使用这样的东西：

在视图中：

<script>var TxMyExtKeyTabNumber = {tab}</script>
<script src="path/to/static/script.js"></script>

在 script.js 中：

$("#container").val(TxMyExtKeyTabNumber);
于 2012-04-18T17:00:54.687 回答
3

我有没有 ![CDATA[. 我在将元素 ID 传递给流体模板中的模态时遇到问题

                document.addEventListener("DOMContentLoaded", function(event) {
                    var deki = '#modal-{data.uid}'; // data.uid is fluid variable 
                        $(deki).on('show.bs.modal', function () {
                            // call play() on the <video> DOM element
                            $('#videoId1')[0].play()
                        });
                        $(deki).on('hidden.bs.modal', function () {
                            // call play() on the <video> DOM element
                            $('#videoId1')[0].pause()
                        })

                });
于 2021-03-10T20:15:45.073 回答
1

我做了这样的事情，对于值只需添加{settings.mySettingName}TypoScript 变量或您拥有的任何数据

function getHiddenSettings(className) {
    var settings = {};
    $.each($(className), function (index, input) {
        if (input.dataset.type === "integer") {
            settings[input.name] = parseInt(input.value) || 0;
        } else if (input.dataset.type === "boolean") {
            settings[input.name] = !!(parseInt(input.value) || input.value === "true")
        } else if (input.dataset.type === "string") {
            settings[input.name] = input.value;
        }
    });
    return settings;
}

var settings = getHiddenSettings(".mySettings");

$('pre').html(JSON.stringify(settings, null, 2));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="hidden" class="mySettings" name="closedTimes" value="0" data-type="integer">
<input type="hidden" class="mySettings" name="onlyEmail" value="false" data-type="boolean">
<input type="hidden" class="mySettings" name="serverError" value="Server problem" data-type="string">
    
<pre></pre>

于 2017-02-22T00:34:00.873 回答
0

不好（但也不比 CDATA 的东西更丑），但可以直接在 javaScript 中使用标记符号流。在 { } 括号之外，您当然可以直接访问流体变量。在括号内，您可以使用任何流体标签包装流体变量。

所以下面的所有例子都可以工作......

<script>
   var myGlobal = {fluidVar};
   function myFunc(){
      var myLocal = <f:format.raw>{fluidVar2}</f:format.raw>
      var myLocal2 = <f:if condition="1">{fluidVar3}</f:if>
   }
</script>
于 2016-07-19T15:46:34.133 回答