.NET MVC学习笔记三

1、c#去掉guid中间的横杠

string testGuidStr= Guid.NewGuid().ToString("N"); 

 

2、MVC页面删除前提示

2.1 在页面加入如下代码

<script type="text/javascript">

function confirmDelete(delUrl) {

if (confirm("您确定要删除用户吗?")) {

document.location = delUrl;}}

</script>

2.2 点击删除的URL链接代码

@Html.RouteLink("删除",new{controller = "控制器名",action = "action名",UserName = 参数名})

 

3、在浏览器中新弹出窗口

3.1 加入scripts代码

@section scripts  {

<scripttype="text/javascript">

function openwin() {

window.open("../Book/BookTypeInfo.html", "newwindow", "height=100, width=400, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no") }} 

</script>

3.2 链接

<ahref="#"onclick="openwin()">打开一个窗口</a>

3.3 给新弹出的窗口,加一个关闭按钮

<form>

<inputtype='button'value='关闭'onclick='window.close()'>

</form>

 

4、操作MySQL进行模糊查询

4.1 主要知识点

使用instr(要查询的字段,?要匹配的参数)函数,加参数

4.2 参考代码

MySqlConnection myconn = null;

MySqlCommand mycom = null;

MySqlDataReader myreader = null;

myconn = newMySqlConnection(DbConnction.connectionString);

mycom = newMySqlCommand("select * from 要查询的表 where instr(要查询的字段,?参数) ", myconn);

mycom.Parameters.Add("@参数", MySqlDbType.VarChar).Value = “要模糊查询的内容”;

myconn.Open();

myreader = mycom.ExecuteReader();

while (myreader.Read()){读数据库中的内容}

if (myreader != null) { myreader.Close(); }

if (myconn != null) { myconn.Close(); }

 

5、查询发布文章最多的前10名用户姓名

5.1 思路

获得发布文章的用户组,然后统计用户组中用户个数,排序,找出前10名用户。

5.2 参考语句

以MySQL方法为例:
select用户姓名 from(select count(用户姓名)as UserNum,用户姓名 from 表 group by 用户姓名) UserNumTable order by UserNum desc limit 0,10

 

6、 mvc操作json

6.1 前端代码

<span id="_content" ></span>

<script type="text/javascript">

    function upclick(o) {

        var obj = document.getElementById("输入框的Id值").value;

        $.ajax({

            url: "/提交的请求地址/参数?ran=" + Math.random(),

            type: "GET",

            dataType: "json",

            data: {参数: obj},

            success: function (data) {

                $("#_content").html(data);

            }, }) }

</script>

6.2 后端代码

放到 ViewAction里

var res = new JsonResult(); 

res.Data = "请输入要查询的内容";

//允许使用GET方式获取,否则用GET获取是会报错。 

res.JsonRequestBehavior = JsonRequestBehavior.AllowGet;

return res; 

 

7、view前端输入框JavaScript校验

7.1以输入框<input type="text" name="test" id=" test " class=" test "/>为例

  <form action=" " method="post">

   <input type="text" name="test" id=" test " class=" test "/>

   <input type="submit" value="提交" onclick="return check(this.form)"/>

  </form>

7.2提示显示 :<span id="_content" ></span>

7.3校验内容: 输入框不能为空值,输入的字符不能超过30

<script type="text/javascript">

    function check(form){

        var obj = document.getElementById("test ").value;

        if (form.findText.value == '') {

           $("#_content").html("输入不能为空");

           form.findText.focus();

           return false;

        } else if (obj.length > 30) {

            $("#_content").html("输入的字符最多为30");

            form.findText.focus();

            return false;

        } else

        {

            return true;

        }

    }

</script>

 

8、RouteLink使用

<li>

  @Html.RouteLink(linkText: "帮助中心", routeName: "Default", routeValues: new { controller = "HelpCenter", action = "Index" }, htmlAttributes: new { @onmouseover = "return ContentDivChange('1','6',7);" })

 </li>

 

9、点击button返回上一页

<button  onclick="window.location='@Request.UrlReferrer'">返回</button>

<input type="button" value="返回"onclick="javascript:history.go(-1);"/>

 

10、用Html.TextBoxFor设置默认值

@Html.TextBoxFor(m => m.模型, new { @Value = (Model==null) ? “默认值” : Model. 模型})

 

11、如何禁用Visual Studio 2013的Browser Link功能

11.1 方法一

11.2 方法二

 

12、jquery 实现鼠标点击文本框清空文本内容,鼠标离开后,恢复内容

<script>

$(function () {

   var text;  // 全局变量用于保存文本框的内容

   $("input:text").focus(function () {

   text = $(this).val();

   $(this).val("");

   });

   $("input:text").blur(function () {

   $(this).val() != "" || $(this).val(text);

   }); })

</script>

 

13、mvc带参数跳转页面

return RedirectToAction("Action名","控制器名", new { 参数= 参数值});

 

14、jQuery图片轮播的实现

14.1 html代码

<div id="scrollPics">
    <ul class="slider" >
        <li><img src="images/ads/1.gif"/></li>
        <li><img src="images/ads/2.gif"/></li>
        <li><img src="images/ads/3.gif"/></li>
        <li><img src="images/ads/4.gif"/></li>
        <li><img src="images/ads/5.gif"/></li>
    </ul>
    <ul class="num" >
        <li class="on">1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
</div>

14.2 css代码

#scrollPics{
    height: 150px;
    width: 100%;
    margin-bottom: 10px;
    overflow: hidden;
    position:relative;
}
.num{
    position:absolute;
    right:5px;
    bottom:5px;
}
#scrollPics .num li{
    float: left;
    color: #FF7300;
    text-align: center;
    line-height: 16px;
    width: 16px;
    height: 16px;
    cursor: pointer;
    overflow: hidden;
    margin: 3px 1px;
    border: 1px solid #FF7300;
    background-color: #fff;
}
#scrollPics .num li.on{
    color: #fff;
    line-height: 21px;
    width: 21px;
    height: 21px;
    font-size: 16px;
    margin: 0 1px;
    border: 0;
    background-color: #FF7300;
    font-weight: bold;
}

用绝对定位设置列表 num 的位置,对 li 设置相关样式,on 表示显示图片对应的数字列表中 li 的样式类别

14.3 javascript代码

//滚动广告
    var len = $(".num > li").length;
    var index = 0;  //图片序号
    var adTimer;
    $(".num li").mouseover(function() {
        index = $(".num li").index(this);  //获取鼠标悬浮 li 的index
        showImg(index);
    }).eq(0).mouseover();
    //滑入停止动画,滑出开始动画.
    $('#scrollPics').hover(function() {
        clearInterval(adTimer);
    }, function() {
        adTimer = setInterval(function() {
            showImg(index)
            index++;
            if (index == len) {       //最后一张图片之后,转到第一张
                index = 0;
            }
        }, 3000);
    }).trigger("mouseleave");

    function showImg(index) {
        var adHeight = $("#scrollPics>ul>li:first").height();
        $(".slider").stop(true, false).animate({
            "marginTop": -adHeight * index + "px"    //改变 marginTop 属性的值达到轮播的效果
        }, 1000);
        $(".num li").removeClass("on")
            .eq(index).addClass("on");
    }