• Vue表单提交


    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="vueform.aspx.cs" Inherits="WebApplication1.test.vueform" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>vue表单提交</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="https://cdn.bootcss.com/vue/2.3.4/vue.js"></script>
    <script src="https://cdn.bootcss.com/axios/0.16.2/axios.js"></script>
    </head>
    <body>
    <form id="form" runat="server">
    <input type="text" value="" v-model="name" placeholder="请输入用户名">
    <input type="text" value="" v-model="age" placeholder="请输入年龄">
    <input type="file" name="fileup" id="fileup" v-on:change="fileChange($event)" />
    <button v-on:click="add">
    提交</button>
    </form>
    </body>
    </html>
    <script type="text/javascript">
    var vm = new Vue({
    el: '#form',
    data: {
    name: '',
    age: '',
    file: ''
    },
    methods: {
    add: function (event) {
    var that = this;
    var username = that.name;
    var userage = that.age;
    $.ajax({
    type: 'post',
    url: '/Handler/Handler1.ashx',
    data: { "username": username, "userage": userage },
    success: function (res) {
    alert("返回值:" + res);
    }
    });
    },
    fileChange: function (el) {
    alert(22);
    // if (!el.target.files[0].size) return;
    // var obj = new FormData(document.getElementById("form"));
    // obj.append("name", "wzh");
    // var _this = this;
    // $.ajax({
    // type: 'post',
    // url: '/Handler/Handler1.ashx',
    // data: obj,
    // cache: false,
    // processData: false, // 不处理发送的数据,因为data值是Formdata对象,不需要对数据做处理
    // contentType: false, // 不设置Content-type请求头
    // success: function (res) {
    // var arr=res.split(':');
    // if(arr[0]=="ok"){
    // _this.img=arr[1];
    // }else{
    // alert(arr[1]);
    // }
    // },
    // });
    }
    }
    })
    </script>

    后台接收数据:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.IO;
    using System.Text;
    namespace WebApplication1.Handler
    {
    /// <summary>
    /// Handler1 的摘要说明
    /// </summary>
    public class Handler1 : IHttpHandler
    {

    public void ProcessRequest(HttpContext context)
    {


    //HttpPostedFile uploadfile = context.Request.Files["fileup"];
    //if (uploadfile == null)
    //{
    // context.Response.Write("no:非法上传");
    // return;
    //}
    //if (uploadfile.FileName == "")
    //{
    // context.Response.Write("no:请选择文件");
    // return;
    //}
    //string fileExt = Path.GetExtension(uploadfile.FileName);
    //StringBuilder sbtime = new StringBuilder();
    //sbtime.Append(DateTime.Now.Year).Append(DateTime.Now.Month).Append(DateTime.Now.Day).Append(DateTime.Now.Hour).Append(DateTime.Now.Minute).Append(DateTime.Now.Second);
    //string dir = "/UploadFile/" + sbtime.ToString() + fileExt;
    //string realfilepath = context.Request.MapPath(dir);
    //string readDir = Path.GetDirectoryName(realfilepath);
    //if (!Directory.Exists(readDir))
    // Directory.CreateDirectory(readDir);

    //uploadfile.SaveAs(realfilepath);
    //context.Response.Write("ok");

    string name = context.Request["username"].ToString();

    context.Response.Write(name);

    }

    public bool IsReusable
    {
    get
    {
    return false;
    }
    }
    }
    }

  • 相关阅读:
    Visual Studio使用技巧笔记(引用程序集自动复制dll到引用项目目录)
    图解-Excel的csv格式特殊字符处理方式尝试笔记(个人拙笔)
    Nuget.config格式错误,请检查nuget.config配置文件
    securecrt切换会话(session)的显示方式
    javascript将分,秒,毫秒转换为xx天xx小时xx秒(任何语言通用,最通俗易懂)
    Http状态码枚举(摘自 Microsoft 程序集 System.dll)
    Visual Studio 提示某个dll文件(已在Microsoft Visual Studio 外对该文件进行了修改,是否重新加载它)
    IIS Express mime type 列表。
    为什么要 MySQL 迁移到 Maria DB
    降维技术---PCA
  • 原文地址:https://www.cnblogs.com/wugh8726254/p/13213911.html
Copyright © 2020-2023  润新知