Question

我对这些东西很陌生，所以请耐心等待。

我正在使用ASP.NET MVC。

当有人点击与某个数据库条目对应的按钮时，我创建了一个覆盖页面来覆盖页面。因此，我的所有代码都是在我的项目中包含的.js文件中。

我需要做的是使用AJAX调用从数据库本身中提取与我的条目相对应的信息，并将其放入我的文本框中。然后，在最终用户进行了所需的更改之后，我需要更新该条目的值以匹配输入。我已经在网上冲浪了一段时间，但未能找到符合我需求的例子。

到目前为止，这是我的javascript文件中的代码：

function editOverlay(picId) {
      //pull up an overlay
      $('body').append('<div class="overlay" />');
      var $overlayClass = $('.overlay');

      $overlayClass.append('<div class="dataModal" />');
      var $data = $('.dataModal');

      overlaySetup($overlayClass, $data);


      //set up form
      $data.append('<h1>Edit Picture</h1><br /><br />');

      $data.append('Picture name: &nbsp;');
      $data.append('<input class="picName" /> <br /><br /><br />');

      $data.append('Relative url: &nbsp;');
      $data.append('<input class="picRelURL" /> <br /><br /><br />');

      $data.append('Description: &nbsp;');
      $data.append('<textarea class="picDescription" /> <br /><br /><br />');

      var $nameBox = $('.picName');
      var $urlBox = $('.picRelURL');
      var $descBox = $('.picDescription');

      var pic = null; 

//this is where I need to pull the actual object from the db
      //var imgList = 
      for (var temp in imgList)  {
          if (temp.Id == picId) {
              pic= temp;
              }
          }

  /*
      $nameBox.attr('value', pic.Name);
      $urlBox.attr('value', pic.RelativeURL);
      $descBox.attr('value', pic.Description);
  */

      //close buttons
      $data.append('<input type="button" value="Save Changes" class="saveButton" />');
      $data.append('<input type="button" value="Cancel" class="cancelButton" />');


      $('.saveButton').click(function() {
          /*
          pic.Name = $nameBox.attr('value');  
          pic.RelativeURL = $urlBox.attr('value');
          pic.Description = $descBox.attr('value');
          */

          //make a call to my Save() method in my repository

          CloseOverlay();
      });

      $('.cancelButton').click(function() {
          CloseOverlay();
      });
  }

我已经评论过的内容是我需要完成和/或在先前的问题得到解决之前无法使用的内容。

感谢所有建议！请记住，我对这些东西非常新（两周，确切地说），可能需要高度明确的指示。

BTW：overlaySetup（）和CloseOverlay（）是我居住在其他地方的函数。

谢谢！

Answer 1

您不能（也不应该）直接从Javascript连接到数据库。即使你理论上可以（我认为没有什么是不可能的）你也不应该这样做;你必须向公众开放数据库，这样才能让任何致力于安全的人在完成自己的工作后拔掉你的头发。

你应该做的是找到一些可以充当数据库代理的中介。几乎和ASP.NET一样，如果这是一个足够好的提示。

如果不是：

创建自定义ASP.NET控件并填充表单数据服务器端。进行回发后句柄验证，然后更新数据库服务器端。

Answer 2

我使用jQuery（使用封面下的HTTP Request对象）。您当然必须创建一个与之对话的Web服务，以便进行数据库访问。您应该将XML和JSON视为格式化传递数据的替代方法。

Answer 3

这听起来像是WCF数据服务的完美任务。这基本上让jQuery直接（几乎）与您的数据库对话。查看http://stephenwalther.com/blog/archive/2010/03/30/using-jquery-and-odata-to-insert-a-database-record.aspx以获取示例。

Answer 4

可以使用jQuery完成ajax调用，它会将Post发送给控制器操作。控制器将接受Post并执行持久性。

<强>的jQuery

  $('.saveButton').click(function() {
      //prepare your content
      var data = {
          name: $nameBox.val(),
          relativeUrl: $urlBox.val(),
          description: $descBox.val()
      };

      //make a call to my Save() method in my repository          
      $.ajax({
          url: "/mycontroller/action",
          data: JSON.stringify(data),
          type: "POST",
          cache: false,
          contentType: "application/json; charset=utf-8"
      }).done(function(data) {
          //do something when request returns
          CloseOverlay();
      });
  });

<强>控制器

public class MyController : BaseController
{
    [HttpPost]
    public ActionResult Action(string name, string relativeUrl, string description)
    {
        //not sure what repository you're using.
        //replace this with your actual repository implementation
        var repository = new MyRepository();
        repository.Save(name, relativeUrl, description);
    }
}

如何使用javascript通过AJAX调用来访问我的数据库？

4 个答案: