如何使用knockout.js将所选值从下拉列表保存到数据库中 [英] How to save the selected value from dropdown into database using knockout.js

问题描述

我有一个列表页面。在该页面中，我有一个添加新项目的按钮。

当我点击添加新按钮时，会弹出一个弹出窗口，在弹出窗口中我需要添加新项目并保存。





Popup包含文本框和下拉控件。现在，当我单击保存时，在文本框中输入的数据会被保存，但下拉列表中的选定数据不会被保存。请帮我这样做。



这个代码我写的：





在API控制器中：

Hi,


I have a listing page. and in that page i have a button to add new item.
When i click on the add new button, a popup displays and in that popup i need to add the new item and save.


Popup contains textboxes and dropdown controls. Now when i click save the data entered in textboxes get saved but the selected data from dropdown is not getting saved. Please help me to do this.

This the code what i have written:


In API controller:

public HttpResponseMessage Post(TKTJOB job)
        {

            HelpDeskRepository.AddJob(job);
            var response = Request.CreateResponse<TKTJOB>(HttpStatusCode.Created, job);
            string uri = Url.Link("DefaultApi", new { id = job.JobId });
            return response;
        }

在My.js

In My.js

$(document).ready(function () {
    ko.applyBindings(new HelpDesk(), document.getElementById('full'));
});
function HelpDesk() {
    var self = this;
    self.JobID=0 ;
    self.CategoryId=0;
    self.JobTitle="";
    self.JobDesc="";
      
    self.category = ko.observable([]);
    self.categorySelected = ko.observable();
        $.getJSON("api/helpdeskapi/getCategory", function (data) {
        self.category(data);
    });
   
    self.addTicket = function () {
        $.ajax({
            url: "api/helpdeskapi/Post",
            type: 'post',
            data: ko.toJSON(this),
            contentType: 'application/json',
            success: function (result) { }
        });
    }
}

弹出窗口：

In popup:

<select style = "font-size: 12px; font-weight: normal;" data-bind="options: category, optionsText: 'Category',optionsValue: 'CategoryId',Value: categorySelected,  optionsCaption: '........Select........'"></select>

推荐答案

（document）.ready（function（）{
ko.applyBindings（new HelpDesk（） ，document.getElementById（'full'））;
}）;
函数HelpDesk（）{
var self = this;
self.JobID = 0;
self.CategoryId = 0;
self.JobTitle =;
self.JobDesc =;

self.category = ko.observable（[]）;
self.categorySelected = ko.observable（）;

(document).ready(function () { ko.applyBindings(new HelpDesk(), document.getElementById('full')); }); function HelpDesk() { var self = this; self.JobID=0 ; self.CategoryId=0; self.JobTitle=""; self.JobDesc=""; self.category = ko.observable([]); self.categorySelected = ko.observable();

.getJSON（api / helpdeskapi / getCategory，function（data）{
self.category（data ）;
}）;

self.addTicket = function（）{

.getJSON("api/helpdeskapi/getCategory", function (data) { self.category(data); }); self.addTicket = function () {

.ajax（{
url：api / helpdeskapi / Post，
type ：'post'，
data：ko.toJSON（this），
contentType：'application / json'，
success：function（result）{}
}）;
}
}

.ajax({ url: "api/helpdeskapi/Post", type: 'post', data: ko.toJSON(this), contentType: 'application/json', success: function (result) { } }); } }

弹出窗口：

In popup:

<select style = "font-size: 12px; font-weight: normal;" data-bind="options: category, optionsText: 'Category',optionsValue: 'CategoryId',Value: categorySelected,  optionsCaption: '........Select........'"></select>

这篇关于如何使用knockout.js将所选值从下拉列表保存到数据库中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！