Front-End Ajax transfer value background to receive and write to the database __ database

Or a small rookie of me, the first time to write a blog, forgive Oh ...
The problem bothered me for two days, but it was so easy to find out ...
(1) The requirement is this, I want to implement a function of inserting a chart, the properties of the chart include name, type and URL. The front-end interface is this:

I want to pass the value in the input box to the background. This is how I handled it at first, but it always complains, type: "POST" will always report 405 of the error, type: "Get" will be reported as a unsupported, but at this time I do not care about using the Get method/api/ After charts with the parameters in the http://www.baidu.com "://" The present is garbled, still in the tangle is the transmission method error.

$ (() {
    (e) {
        form = $ (e.currenttarget). Parents ('. Modal '). Find (' form ');
         data = {
            name:form.find (' input ') [1].value,
            type:form.find (' input ') [0].value,
            Src:form.find ( ' Input ') [2].value
        };

        $.ajax ({
            contentType: "Application/json;charset=utf-8",
            URL: "/api/charts",
            type: "Post"
            , Data:data,
            (data) {
                console.log (data)}})
})

However, the tangle of a day of errors only need to add one of the methods to solve the garbled problem.

Change Data:data to Data:JSON.stringify (data)                                               

Add Chart
@RequestMapping (value = "/charts", method = requestmethod.post) public
apiresponse<chart> Addchart (@RequestBody Chart Chart) {
   chartservice.insert (Chart);
   list<chart> results = new arraylist<chart> ();
   Results.add (chart);
   Return success (1, results);
}

(2) Another problem is that the ID is not possible when the front end is inserted, and the properties of the chart object include ID,NAME,TYPE,SRC. I created a sequence vis_chart_id in the database to create the ID, and then write the SQL Insert chart with just the write:

Insert into Vis_chart (ID,NAME,TYPE,SRC) VALUES (VIS_CHART_ID.NEXTVAL,:NAME,:TYPE,:SRC)

However, this method is not feasible, in the front-end to get the error will always be, the location of the ID is null, think is also, the front-end data is not as a complete object passed, certainly is not successful. How about that.

As a small intern, must be to find experienced predecessors asked. Thanks to the power of predecessors, I get to new skills ...

The steps are as follows:

1. First create a method inside the DAO called Getsequence (), get the next sequence value as the ID of the newly inserted chart

@SqlQuery ("Select Vis_chart_id.nextval from Dual")
@Mapper (integermapper.class)
Integer getsequence ();

Be careful to change the SQL statement in the Insert method to

@SqlUpdate (INSERT into Vis_chart (ID,NAME,TYPE,SRC) VALUES (: ID,:NAME,:TYPE,:SRC))
//Insert Chart
void Insert (@ Bindbean Chart Chart);

2. Then assign the ID to chart in service

Public  void Insert (Chart Chart) {
   Chartdao Chartdao = Dbi.ondemand (chartdao.class);
   Integer id = chartdao.getsequence ();
   Chart.setid (ID);
   Chartdao.insert (chart);
}

3. So when controller calls the Insert method, the chart will have an ID.

Add Chart
@RequestMapping (value = "/charts", method = requestmethod.post) public
apiresponse<chart> Addchart (@RequestBody Chart Chart) {
   chartservice.insert (Chart);
   list<chart> results = new arraylist<chart> ();
   Results.add (chart);
   Return success (1, results);
}

is the sauce, I do not know whether my statement is completely correct, you are welcome to advise ...