获取HTML Form Post方法的返回值 [英] Get the return value of a HTML Form Post method
问题描述
我有一个Mason组件（A.m）中的HTML表单，它使用post方法调用另一个Mason组件（B.m）。我希望这个Mason组件（B.m）将值返回给Mason组件中的HTML表单（A.m）。然后我想将这个返回值传递给一个Javascript函数。
我该怎么做？我是新开发的web开发人员。
虽然不是绝对必要的，但我建议您使用 jQuery ，它会使事情变得更容易。请看看这个问题： jQuery AJAX提交表单
这里是梅森的一个小例子，当然这很简单，你应该添加一些错误检查和一些转义，但我认为这可能是一个好的开始。您的 A.mc 组件可能如下所示：
< html> ;
< head>
< title>这是A< / title>
< script src =// ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js\"> ;</script>
< script>
$（document）.ready（function（）{
$ b $（＃myform）。submit（function（）{//截取提交事件
$ .ajax （{//创建一个AJAX请求
类型：POST，
url：B，//它是组件的URL B
data：$（＃myform） .serialize（），//序列化表单的元素
成功：函数（数据）
{
//显示从B得到的数据到结果div
$（＃结果）.html（data）;
}
}）;
e.preventDefault（）; //避免执行表单的实际提交
}）;
}）;
< / script>
< / head>
< body>
< form id =myform>
< input type =textname =mytext/>
< input type =submit/>
< / form>
< div id =result>< / div>
< / body>
< / html>
它只是一个加载jQuery库并包含表单的HTML页面，并且包含一些代码指示表单在用户单击Submit按钮时向B组件发出AJAX请求，然后在结果div中显示由B组件返回的内容。
可能是您的 B.mc 组件：
<％class>
有'mytext';
< /％class>
我收到了这段文字< strong><％$ .mytext％>< / strong>从您的表单
及其长度为< strong><％length（$。mytext）％>< / strong> ;.
结果如下：
I have a HTML form in a Mason component(A.m) that uses the post method to call another Mason component(B.m). I want this Mason component(B.m) to return a value to the HTML form in the Mason component(A.m). Then I want to pass this returned value to a Javascript function.
How can I do this? I'm new to web development.
You need to make an AJAX request. Although not strictly necessary, I would suggest you to use jQuery, it will make things a lot easier. Please also have a look at this question: jQuery AJAX submit form
Here's a little example in Mason, it's very simplified of course, you should add some error checking and some escaping also, but I think it could be a good start. Your A.mc component could look like this:
<html>
<head>
<title>This is A</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#myform").submit(function() { // intercepts the submit event
$.ajax({ // make an AJAX request
type: "POST",
url: "B", // it's the URL of your component B
data: $("#myform").serialize(), // serializes the form's elements
success: function(data)
{
// show the data you got from B in result div
$("#result").html(data);
}
});
e.preventDefault(); // avoid to execute the actual submit of the form
});
});
</script>
</head>
<body>
<form id="myform">
<input type="text" name="mytext" />
<input type="submit" />
</form>
<div id="result"></div>
</body>
</html>
it's just an HTML page that loads jQuery library and that contains your form, and that contains some code to instruct the form to make an AJAX request to B component when the user clicks the Submit button and then to show the contents returned by B component in your result div.
And this could be your B.mc component:
<%class>
has 'mytext';
</%class>
I got this text <strong><% $.mytext %></strong> from your form,
and its length is <strong><% length($.mytext) %></strong>.
Result will be like this:
这篇关于获取HTML Form Post方法的返回值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
