将图像数据保存在ajax请求MVC上

时间:2014-08-07 13:28:44

标签: javascript jquery ajax asp.net-mvc

大家好我想保存图片数据:点击使用ajax的id,title和album title。 所以这是我的模型

    [Key]
    public int ID { get; set; }
    public string albumTitle { get; set; }

    public string photoUrl { get; set; 

控制器

  public ActionResult Save()
    {
        return View("Index");
    }
    [HttpPost]
    public ActionResult Save(int id,string photoUrl, string albumName)
    {
        ps.ID = id;
        ps.photoUrl = photoUrl;
        ps.albumName = albumName;

        return View("Index");
    }

和查看

 @model FlickrApi.Models.FavouritePhotos
<div id="gallery">

</div>

<script>
    $(document).ready(function () {

        var url = 'https://api.flickr.com/services/rest/?&method=flickr.photosets.getList&api_key=715a9548b42114d69859975d717210cd&user_id=126550680@N04&format=json&jsoncallback=?';
        $.getJSON(url, function (data) {
            $.each(data.photosets.photoset, function (idx, item) {

                var photosetid = item.id;
                var photosurl = 'https://api.flickr.com/services/rest/?&method=flickr.photosets.getPhotos&api_key=e6be1bfdf4294482904dce01ac431615&photoset_id=' + photosetid + '&media=photos&format=json&jsoncallback=?&per_page=?';

                // here you would build a new url for each photoset
                // example of how to extract just printing "secret" on right
                $('#gallery').append('<h3 class="echo" id="' + idx + '" >' + item.title._content + '</h3><ul class="gallery photos grp' + idx + '"></ul>');

                // once url is built you would pass to plugin, or make own getJSON request for each set and then parse results same way 'secret' extracted above to insert into page
                $.getJSON(photosurl, function (data) {
                    $.each(data.photoset.photo, function (photoNum, photo) {
                        var photoid = photo.id;
                        var secret = photo.secret;
                        var server = photo.server;
                        var farm = photo.farm;
                        var photo_url = 'http://farm' + farm + '.static.flickr.com/' + server + '/' + photoid + '_' + secret + '_s.jpg';
                        var photo_urlm = 'http://farm' + farm + '.static.flickr.com/' + server + '/' + photoid + '_' + secret + '_m.jpg';
                        $('.photos.grp' + idx).append('<li><a class="example" data-toggle="tooltip"  title="' + photo.title + '"  href="#"><img class="save" src="' + photo_url + '" /></a></li>');
                        //   $('.photos.grp' + idx).css('display','none');
                        $('.photos').css('list-style-type', 'none');
                        $('.example').tooltip(
                        {
                            animation: true,
                        });
                        $('.save').click(function() {
                            $.ajax({
                                type: "POST",
                                url: '@Url.Action("Save","Home")',
                                data: {id: photo.id, photoUrl:photo_url, ablumName: photo.title}


                            });
                        });
                    });


                });
            });

    });


});

Chrome控制台发送给我500内部服务器错误,我希望有人会帮助我,我会非常愉快的任何帮助,thx。如果有人需要我在调用ajax来检索图像时所获得的是jsbin上的示例代码http://jsbin.com/xerojane/5/edit

0 个答案:

没有答案