【问题标题】:Setting razor variables in javascript在javascript中设置剃刀变量
【发布时间】:2011-07-02 03:24:47
【问题描述】:

我正在尝试从 javascript 函数中为我的表单上的组合框的内容分配一个剃刀变量。像这样:

<script type ="text/javascript">
<!--
    function SomeFunction() {

        var hours = document.getElementById("Hours");
        var task = document.getElementById("TaskType_ID");
        @{            
            var tsk = @:task.value;            
         }

        @{            
        <text>
            hours.value = '@ViewBag.TaskTypes.GetHours(tsk)';
        </text>
        }

        return true;
    }

//-->
</script>

这条线(以及我尝试过的所有其他变体)

var tsk = @:task.value;

导致错误。

【问题讨论】:

  • 好的,你在这里混合了客户端(javascript)和服务器(asp.net / razor)技术,它不会像你尝试的那样工作。您需要使用 AJAX 来弥补差距。假设您有两个组合框并且您希望在用户从任务组合框中选择一个选项时更改小时组合框中的选项,我是否正确?
  • @RobG Razor 是用于在 asp.net mvc 3 中创建页面的最新语法引擎。
  • Chris - 正如您所说,OP 需要将服务器代码与客户端代码分开,并且应该指定要实现的结果,而不仅仅是发布非工作代码。
  • 嗨,克里斯 - 我有一个包含一些任务代码的组合框。在此组合框的 onchange 事件期间,我想计算小时数(从控制器传入的对象)并将此值放在文本框中。

标签: javascript asp.net-mvc-3 razor


【解决方案1】:

正如 Chris 所指出的,您正在混合客户端和服务器代码。 javascript是客户端代码,你需要来自服务器的数据通过ajax调用函数(get/post)返回你想要的值。这是你可以做些什么的sn-p代码:

$("#tasks").change(function(){
    $.get('url',$(this).val(), function(data){
        // data is the hours returned from the selected task
        $("#hours").val(data);
    });
});

或者,您不必每次选择任务时都调用服务器,而是始终将任务的值存储在变量中。谢谢

【讨论】:

  • 谢谢@Xnake。我会试试这个,让大家知道结果如何。
【解决方案2】:

好的。这就是我最终要做的。我不再将对象传递到视图中。我添加了一个绑定到我的第一个字段的更改事件的脚本,然后通过 ajax 在我的控制器中调用一个操作并将结果放入第二个字段。像这样:

<script type="text/javascript">

    $(document).ready(function () {
        $("#q").change(function () {
            $.ajax({
                type: "GET",
                url: "Home/Test?value=" + $('#q').get(0).value,
                success: function(msg) {
                    $('#x').get(0).value = msg;
                }
            });
        });
    });

</script>

感谢您带领我朝着正确的方向前进。使用所有剃刀语法,我忘记了这仍然是 html。我希望你们都喜欢看我尝试将方形钉子敲入圆孔!

【讨论】:

    猜你喜欢
    • 2012-04-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-02-19
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多