(13) 添加视图 Edit.cshtml

Views/AdminBlog/Edit.cshtml

@model core_admin.utils.MyResult
@using core_admin.utils
@using core_admin.m

@{
    Layout="_LayoutAdmin";
    ViewData["Title"] = "管理";
    blog m_blog = (blog)Model.data;
}

<link rel="stylesheet" type="text/css" href="/lib/webupload/webuploader.css">
<script type="text/javascript" src="/lib/jquery/dist/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="/lib/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="/lib/ueditor/ueditor.all.js"></script>
<script type="text/javascript" charset="utf-8" src="/lib/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" charset="utf-8" src="/lib/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="/lib/webupload/webuploader.js"></script>

<div>
    <ul class="nav justify-content-end">
        <li>
            <a href='/AdminBlog/Add'>添加博客</a>
        </li>
        <li>
            <a href='/AdminBlog/Index'>博客列表</a>
        </li>
    </ul>
</div>

<div class='container'>

    <div id='add_div'>

            <div class="form-group">
        <label for="txt_blog_title">标题：</label>       
        <input type="text" class="form-control" id="txt_blog_title"  value="@m_blog.blog_title"/>
        <input type="hidden" id='hid_blog_id' value="@m_blog.blog_id" />
    </div>

    <div class="form-group">
        <label for="hid_blog_image">图片：</label>

        <div class="layui-input-block">
            <div id="uploader" class="wu-example">
                <input type="hidden" id="hid_blog_image" value="@m_blog.blog_image" />
                <div id="thelist_blog_image" class="uploader-list">
                  @{
                        string displayMinus = " style='display:none;'";
                    }
                    @if (!string.IsNullOrEmpty(m_blog.blog_image))
                    {
                        <img src='@m_blog.blog_image' style='width:200px;' />
                        displayMinus = "";
                    }
                </div>
                <a href="javascript:void(0)" onclick="remove_pic()" id="minus_blog_image" @displayMinus>
                    <span class="glyphicon glyphicon-remove"></span>
                </a>
                <!--用来存放文件信息-->
                <div class="btns">
                    <div id="picker_blog_image">选择文件上传</div>
                </div>
            </div>
        </div>
    </div>


    <div class="form-group">
        <label for="txt_blog_desc">描述：</label>       
        <input type="text" class="form-control" id="txt_blog_desc"  value="@m_blog.blog_desc"/>
    </div>

    <div class="form-group">
        <label for="txt_blog_content">内容：</label>
        <div class="layui-input-block">
            <textarea id="txt_blog_content" name="txt_blog_content" rows="5" cols="50">@m_blog.blog_content</textarea>
            <script type="text/javascript">
                var ue = UE.getEditor('txt_blog_content', { initialFrameWidth: 900 });

            </script>
        </div>
    </div>

    <div class="form-group">
        <label for="txt_blog_content_text">纯文本内容：</label>       
        <input type="text" class="form-control" id="txt_blog_content_text"  value="@m_blog.blog_content_text"/>
    </div>

    <div class="form-group">
        <label for="txt_add_date">添加日期：</label>       
        <input type="text" class="Wdate form-control" id="txt_add_date" style="width:200px;height:38px;"
                   onclick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd'})" value='@m_blog.add_date.ToString("yyyy-MM-dd")' />
    </div>

    <div class="form-group">
        <label for="txt_blog_sort">排序：</label>       
        <input type="text" class="form-control" id="txt_blog_sort"  value="@m_blog.blog_sort"/>
    </div>

    <div class="form-group">
        <label for="txt_blog_tags">标签编号：</label>       
        <input type="text" class="form-control" id="txt_blog_tags"  value="@m_blog.blog_tags"/>
    </div>


        
        <div class="form-group">
            <button type="button" class="btn btn-primary"
                    onclick="return edit_save_click()">
                提交
            </button>
            <button type="button" class="btn btn-primary"
                    onclick="ret()">
                返回
            </button>
        </div>

    </div>
  

</div>

<script type="text/javascript">

function ret(){
    location.href = '/AdminBlog/Ret';
    return false;
}

    var BASE_URL = '';

    var uploader = WebUploader.create({

        auto: true,

        // swf文件路径
        swf: BASE_URL + '/webupload/Uploader.swf',

        // 文件接收服务端。
        server: '/Upload/Upload',

        // 选择文件的按钮。可选。
        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
        pick: '#picker_blog_image',

        // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
        resize: false
    });

    uploader.on('fileQueued', function (file) {

        $list = $('#thelist_blog_image');
        $list.append('<div id="' + file.id + '" class="item">' +
            '<h4 class="info">' + file.name + '</h4>' +
            '<p class="state">等待上传...</p>' +
            '</div>');
    });

    uploader.on('uploadSuccess', function (file) {
        $('#' + file.id).find('p.state').text('已上传');

    });

    uploader.on('uploadError', function (file) {
        $('#' + file.id).find('p.state').text('上传出错');
    });

    uploader.on('uploadComplete', function (file) {
        $('#' + file.id).find('.progress').fadeOut();
    });

    uploader.on('uploadAccept', function (file, response) {
        console.log(response) //服务器返回的数据
        var data = eval(response);
        if (data.result == 'success') {
            $('#thelist_blog_image').html('<img src="' + data.data.file + '" style="width:200px;" />');
            $('#hid_blog_image').val(data.data.file);
            $('#minus').show();
        }
    });

    function remove_pic() {
        $('#thelist_blog_image').html('');
        $('#hid_blog_image').val('');
        $('#minus').hide();
    }



    function edit_save_click() {

		var blog_id = $('#hid_blog_id').val();
		var blog_title = $('#txt_blog_title').val();
		var blog_image = $('#hid_blog_image').val();
		var blog_desc = $('#txt_blog_desc').val();
		var blog_content = ue.getContent();
		var blog_content_text = $('#txt_blog_content_text').val();
		var add_date = $('#txt_add_date').val();
		var blog_sort = $('#txt_blog_sort').val();
		var blog_tags = $('#txt_blog_tags').val();


     

        $.post('/AdminBlog/EditSave',
            {
				blog_id : blog_id,
				blog_title : blog_title,
				blog_image : blog_image,
				blog_desc : blog_desc,
				blog_content : blog_content,
				blog_content_text : blog_content_text,
				add_date : add_date,
				blog_sort : blog_sort,
				blog_tags : blog_tags,

                r: Math.random()
            },
            function (data) {
                if (data == 'success') {
                    ret();
                } else {
                    alert(data);
                }
            }
        );

    }

    $(document).ready(function () {
        
    });

</script>