javascript 如何从 JS 调用控制器以便控制器可以执行其请求映射?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26599728/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 06:11:21  来源:igfitidea点击:

How to call a controller from JS so the controller can perform its request mappings?

javajavascriptspringspring-mvc

提问by Jared Smith

i'm trying to have a JavaScript file call a JavaSpring MVC Controller, then the controller will perform its request mapping functions.

我正在尝试让 JavaScript 文件调用 JavaSpring MVC 控制器,然后控制器将执行其请求映射功能。

I'm not sure if it is also possible to pass a variable to the controller so it can know which specific mapping to perform. IF one could demonstrate how to do both that would be immensely helpful. If one can simply show me how to call a controller via JS that would be very helpful as well and answer the question.

我不确定是否也可以将变量传递给控制器​​,以便它知道要执行哪个特定映射。如果一个人可以演示如何做到这两点,那将是非常有帮助的。如果可以简单地向我展示如何通过 JS 调用控制器,那也会非常有帮助并回答问题。

my controller will look similar to the following:

我的控制器将类似于以下内容:

@Controller
@RequestMapping(value = "/waterquality/scale")
public class NmWaidsController {
    @RequestMapping(value = {"","/"})
    public String homePageWaids(){
        return "waterquality/scale/calmix";
    }

I would like the JS to call this controller.

我希望 JS 调用这个控制器。

If possible I would like to do the following, and have the JS pass a variable to the method which would look like the following:

如果可能,我想执行以下操作,并让 JS 将一个变量传递给该方法,如下所示:

@Controller
@RequestMapping(value = "/waterquality/scale")
public class NmWaidsController {
    @RequestMapping(value = {"","/"})
    public String homePageWaids(int viewChoice){
        switch(viewChoice){
             case 1:
                 return "waterquality/scale/calmix";
                 break;
             case 2:
                 return "waterquality/scale/caloddo";
                 break;
             case 3:
                 return "waterquality/scale/calstiff";
                 break;
             default:
                 return error;
                 break;
    }

Any help would be much appreciated! Thanks in advance!

任何帮助将非常感激!提前致谢!

回答by hina10531

Here's an example that you are looking for.

这是您正在寻找的示例。

@RequestParamwill help you out.

@RequestParam会帮助你。

First, JSON object.

首先,JSON 对象。

var loginData = { 
       memberId : "test1",
       memberPw : "test2"
}

Second, Ajax.

第二,阿贾克斯。

 $.ajax({
        type: "POST",
        url: "YouActionName",
        data: loginData,
        success: function (result) {
            // do something.
        },
        error: function (result) {
            // do something.
        }
    });

And finally, your controller. Remember the RequestParam's key names must be matched with the JSON's member key names. It's case sensitive, so be careful.

最后,你的控制器。请记住,RequestParam 的键名必须与 JSON 的成员键名匹配。它区分大小写,所以要小心。

@RequestMapping("/YourActionName")
public String YourActionName(@RequestParam("memberId") String id, @RequestParam("memberPw") String pw ){
  return new ModelAndView("ExpectedReturnView");
} 


attaching event listner is really simple.

附加事件监听器非常简单。

if you have html like this...

如果你有这样的html...

<div id="exampleDiv"></div>

Then using basic id selector, you can attach an event like this below...

然后使用基本的 id 选择器,您可以在下面附加这样的事件...

$('#exampleDiv').click(function(e) {
    // do what you want when click this element.
});

回答by Rohit Patil

<button type="submit" name="deleteAction" onclick="javascript:deleteaction();">Delete</button>

function deleteaction(){
    alert("Are you sure you want to delete the data ?");
    document.User1.action = "${pageContext.request.contextPath}/deleteUsers";
    document.User1.submit();
} 

@RequestMapping(value = "/deleteUsers", method = RequestMethod.POST)
    public ModelAndView deleteUserDetails(@ModelAttribute("User1") User user,ModelMap model) {  
        model.addAttribute("User1",new User());  
}

Hope You can understand the flow

希望你能理解流程