zoukankan      html  css  js  c++  java
  • asp.net mvc ajax FileUpload

    //后台代码 
      [HttpPost]
            public ActionResult CreateCategory(HttpPostedFileBase file)
            {
                string url = Upload(file);
                if(url== "empty")
                {
                    return Json("{state:fault}");
                }
                factory.Endpoint.Behaviors.Add(new WebHttpBehavior());
                var proxy = factory.CreateChannel();
                //用户组请求类
                ServicePostRequest<Guoany_Ga_B2BGCategory_InsertOrUpdate_Request> request = new ServicePostRequest<Guoany_Ga_B2BGCategory_InsertOrUpdate_Request>();
                request.ExtraData = new Guoany_Ga_B2BGCategory_InsertOrUpdate_Request();
                request.ExtraData.Parent_Id = "";
                request.ExtraData.Creater = "";
                request.ExtraData.Creattime = DateTime.Now;
                request.ExtraData.Des = "";
                request.ExtraData.Category_Id = Guid.NewGuid().ToString();
                request.ExtraData.Category_Name = "";
                request.ExtraData.Category_Url = url;
                request.ExtraData.Is_del = false;
                request.ExtraData.Is_show = true;
                request.ExtraData.Is_Special = false;
                request.ExtraData.Sort_No = 1;
                ServicePostResponse<Guoany_Ga_B2BGCategory_InsertOrUpdate_Response> response = proxy.InsertOrUpdateB2B_G_Category(request);
                //  ViewData["Group_Response"] = response.Data;
                bool result = response.Success;
    
                return Json("{state:success}");
            }
            public string Upload(HttpPostedFileBase file)
            {
                if (file == null)
                {
                    return "empty";
                }
                var fileName = Path.Combine(Request.MapPath("~/Upload"), Path.GetFileName(file.FileName));
    
                if (Directory.Exists(Server.MapPath("~/Upload")) == false)//如果不存在就创建file文件夹
                {
                    Directory.CreateDirectory(Server.MapPath("~/Upload"));
                }
                file.SaveAs(fileName);
                return "upload/"+Path.GetFileName(file.FileName);
            }
    //-----------------------------------------------------------------------------------------
    //前台代码
    
    @{
        ViewBag.Title = "类别列表";
    }
    
    <script type="text/javascript">
        $(function () {
            var pager = $('#dg').datagrid().datagrid('getPager');    // get the pager of datagrid
            pager.pagination({
                buttons: [{
                    iconCls: 'icon-search',
                    handler: function () {
                        $('#dg').datagrid("reload");
                    }
                }, {
                    iconCls: 'icon-add',
                    handler: function () {
                        alert('add');
                    }
                }, {
                    iconCls: 'icon-edit',
                    handler: function () {
                        alert('edit');
                    },
                    iconCls: 'icon-remove',
                    handler: function () {
                        alert('删除');
                    }
                }]
            });
    
    
        })
        function searchCategory() {
            var stopOrenable = $('#stopOrenable').combobox('getValue');
            var txtCategoryName = $("#txtCategoryName").val();
            var showOrNot = $("#showOrNot").is(":checked") == true ? 1 : 0;
            var specilCategory = $("#specilCategory").is(":checked") == true ? 1 : 0;
    
            $('#dg').datagrid('load', {
                queryParams: {
                    stopOrenable: stopOrenable,
                    txtCategoryName: txtCategoryName,
                    showOrNot: showOrNot,
                    specilCategory: specilCategory
    
    
                }
    
            });
            //var randnum = Math.floor(Math.random() * 1000000);
            //alert(randnum)
            //var urls = '/Category_Manage/GetCategoryJsonList?randnum=' + randnum;
    
        }
        function addCategory() {
            $('#dd').dialog('open');
    
        }
    
        function editCategory() { }
    
        function showCategory() { }
    
        function hidenCategory() { }
    
        function enabledCategory() { }
    
        function stopCategory() { }
    </script>
    
    
    <script type="text/javascript">
        function PreviewImage(imgFile) {
            var filextension = imgFile.value.substring(imgFile.value.lastIndexOf("."), imgFile.value.length);
            filextension = filextension.toLowerCase();
            if ((filextension != '.jpg') && (filextension != '.gif') && (filextension != '.jpeg') && (filextension != '.png') && (filextension != '.bmp')) {
                alert("对不起,系统仅支持标准格式的照片,请您调整格式后重新上传,谢谢 !");
                imgFile.focus();
            }
            else {
                var path;
                if (document.all)//IE
                {
                    imgFile.select();
                    path = document.selection.createRange().text;
    
                    document.getElementById("imgPreview").innerHTML = "";
                    document.getElementById("imgPreview").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src="" + path + "")";//使用滤镜效果
                }
                else//FF
                {
                    path = window.URL.createObjectURL(imgFile.files[0]);
                    var i = 0;
                    i++;
                    $("#imgPreview").append("<img id='img" + i + "'  width='120px' height='100px' src='" + path + "'/>");
    
                }
            }
        }
        function submitContent()
        {
            var formData = new FormData();
            var file = document.getElementById("upload").files[0];
            formData.append("file", file);
            $.ajax({
                type: "POST",
                url: '@Url.Action("CreateCategory", "Category_Manage")',
                data: formData,
                dataType: 'json',
                contentType: false,
                processData: false,
                success: function (response) {
                    alert("sucess");
                  },
                error: function (error) {
                    alert("fault");
                }
            });
        }
    
    </script>
    <table id="dg" class="easyui-datagrid" title="商品类别列表" style="100%;height:250px"
           data-options="rownumbers:true,singleSelect:true,url:'/Category_Manage/GetCategoryJsonList',method:'get',toolbar:'#tb',footer:'#ft',pagination:true">
        <thead>
            <tr>
                <th data-options="field:'ParentCategoryName',80">上级类目</th>
                <th data-options="field:'Category_Name',100">类目名称</th>
                <th data-options="field:'Is_Del',80,align:'right'">启用状态</th>
                <th data-options="field:'Des',80,align:'right'">描述</th>
                <th data-options="field:'Is_Special',240">是否特殊项目</th>
                <th data-options="field:'Is_show',60,align:'center'">展示状态</th>
                <th data-options="field:'Sort_No',60,align:'center'">排序</th>
    
            </tr>
        </thead>
    </table>
    <div id="tb" style="padding:2px 5px;">
        <div>
            <input type="button" value="新增" onclick="addCategory()" />
            <input type="button" value="编辑" onclick="editCategory()" />
            <input type="button" value="展示" onclick="showCategory()" />
            <input type="button" value="隐藏" onclick="hidenCategory()" />
            <input type="button" value="启用" onclick="enabledCategory()" />
            <input type="button" value="停用" onclick="stopCategory()" />
        </div>
        类目名称 <input id="txtCategoryName" style="110px">
        是否停用
        <select id="stopOrenable" class="easyui-combobox" panelHeight="auto" style="100px">
            <option value="1">是</option>
            <option value="0">否</option>
        </select>
        <input type="checkbox" id="specilCategory" /> 特殊类目 <input type="checkbox" id="showOrNot" /> 是否展示
        <a href="#" id="search" class="easyui-linkbutton" onclick="searchCategory()" iconCls="icon-search">搜索</a>
    </div>
    <div id="dd" class="easyui-dialog" title="新增/编辑"
         data-options="iconCls:'icon-save',closed:true,modal: true,cache: false" style="800px;height:600px;padding:10px">
        @using (Html.BeginForm("CreateCategory", "Category_Manage", FormMethod.Post, new { enctype = "multipart/form-data" }))
        {
            <table style="border:1px solid ;700px;height:500px;">
                <tr>
                    <td>父类目:<input type="text" /></td>
                    <td colspan="2">
                        图片上传:<input type="file" name="file" style=" 200px; height: 20px;" onchange="PreviewImage(this)" id="upload" />
                        <div id="imgPreview" style="120px; height:100px;margin-left: 280px;"></div>
    
                    </td>
    
                </tr>
                <tr><td>类目:<input type="text" /></tr>
                <tr><td>是否特殊类目:<input type="checkbox" /></td><td>是否显示:<input type="checkbox" /></td></tr>
                <tr><td rowspan="1">类描述<textarea rows="2"></textarea></td></tr>
                <tr><td rowspan="1"><input onclick="submitContent()" value="提交" /></td></tr>
            </table>
    
        }
    </div>
    

      

  • 相关阅读:
    个人作业3——个人总结(Alpha阶段)
    单元测试
    个人作业2——英语学习APP案例分析
    结对作业-基于GUI的四则运算
    个人作业1:小学四则运算——基于控制台
    个人作业3--------个人总结(Alpha版本)
    结对作业 2
    个人作业 2
    结对作业 肖荣森(201421123079) 苏上鑫(201421123081)
    作业1---四则运算
  • 原文地址:https://www.cnblogs.com/zengpeng/p/6072889.html
Copyright © 2011-2022 走看看