接触MVC也没多长时间,一开始学的时候绝得MVC结构比较清晰。后来入了门具体操作下来感觉MVC控件怎么这么少还不可以像ASP.net form那样拖拽。这样设计界面来,想我种以前没学过JS,Jquery搞起来据比较吃力了。因此自己一边学一边就积累一些自定义的控件,边用边学,用到哪学到哪!

  首先自定义的是可编辑的下拉框,自己在网上找了一些参考了一些别人用一个文本框和下拉框组合起来实现可编辑的下拉框。最终在不断的尝试下终于成功了,不过也遇到了很多的问题。具体的思路就是文本框+下拉框+写下拉框的onchange事件。本人也是初学者,有说的不对的或不妥的地方欢迎大家指正。共同努力共同进步!

废话不多说了,上前台代码():

<div style="position:relative">
        <span style="margin-left:132px;width:18px;overflow:hidden">
        <select id="s1" style="width:207px;margin-left:-132px;height:23px" onchange="selectChanged()" name="select1">
        <option value="请选择颜色" selected="selected">--请选择颜色--</option>
        @foreach (var color in ViewBag.DropListColor)
        {
            <option value="@color">@color</option>
        }
        </select>
        </span>
        <input type="text" name="color" id="color" style="width:183px;position:absolute;left:0px"/>
        </div>

注意代码的几个地方selectChanged()是一个事先写好的JS代码,当onchange被触发时取下拉框的值到文本框中。

@foreach (var color in ViewBag.DropListColor)
        {
            <option value="@color">@color</option>
        }

这个循环式绑定Controlor发过来的后台数据,注意文本框的name和id属性的值要和你模型属性字段一样,这样的好处是提交的数据会自动绑定到一个模型对象。不用你一一去去,省事多了。还有就是这样可以验证数据的有效性,也就是模型的有效性,可以过滤大多数无效数据。

辅助方法代码(主要参考了该博主的博文http://blog.csdn.net/jiajinhao/article/details/7908027):

string temp = "";
            foreach(string value in colloction)
            {
                temp+="<option value='"+value+"'>"+value+"</option>";
            }
            string str=String.Format("<span style='margin-left:132px;width:18px;overflow:hidden'>"
                                    +"<select id='s1' style='width:207px;margin-left:-132px;height:23px' onchange='selectChanged()' name='select1'>"
                                    +"<option value='{0}' selected='selected'>{1}</option>"
                                    +temp
                                    +"</select></span>"
                                    + "<input type='text' name='{2}' id='{2}'style='width:183px;position:absolute;left:0px'/>", optValue, text, attribute);
            return new MvcHtmlString(str);

需要注意的是一开始把下面这段代码,也放到了str字符串中。毫无疑问运行时抛出异常“不正确的字符串”,左该右改都不行。最后想出了上面的方法解决了问题。

foreach(string value in colloction)
            {
                temp+="<option value='"+value+"'>"+value+"</option>";
            }

当然可能有其他更好的方法,欢迎跟帖,大家一起学习一下。

文本框日历控件代码:

public static MvcHtmlString TextBoxCalender(string IdAndName)
        {
             string str = String.Format(@"<input type='text' id='{0}' name='{0}' style='width:207' onfocus='Calender()' />", IdAndName);
            return new MvcHtmlString(str);
        }

代码比较简单但是需要下载一个js或jQuery的日历控件,直接在文本框的onfocus事件调用就行了。目前就用到的组合控件就这两个,遇到了就解决问题。用到其他组合控件是在学了,书到用时方很少啊!本人也是初学者,有说的不对的或不妥的地方欢迎大家指正。共同努力共同进步!

用MVC的辅助方法自定义了两个控件:“可编辑的下拉框控件”和“文本框日历控件”的更多相关文章

  1. 自定义SWT控件四之其它下拉框

    4.其它下拉框 4.1 添加联动二级多选择框(有添加按钮和删除按钮) package com.view.control.select; import java.util.ArrayList; impo ...

  2. 转:自定义ASP.NET MVC Html辅助方法

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  3. 【MVC】自定义ASP.NET MVC Html辅助方法

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  4. [转载]自定义ASP.NET MVC Html辅助方法 TagBuilder

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  5. 自定义ASP.NET MVC Html辅助方法

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  6. 【草稿】自定义ASP.NET MVC Html辅助方法

    https://www.cnblogs.com/myshell/archive/2010/05/09/1731269.html 在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其 ...

  7. [MVC]Ajax辅助方法

    在开始使用Ajax辅助方法前,必须在页面中载入jQuery以及jquery.unobtrusive-ajax.js文件才能正常执行. 为了让网站载入适当的JS函数库,必须先让Layout页面载入适当的 ...

  8. MVC HTML辅助方法

    HTML辅助方法(HTML Helper)用来辅助产生HTML,在开发View的时候会面对许多HTML标签,处理这些HTML标签非常繁琐,为了降低View的复杂度,可以使用HTML辅助方法帮助你产生一 ...

  9. Android简易实战教程--第二十二话《自定义组合控件模拟qq登录下拉框和其中的一些”小技巧”》

    转载此文章请注明出处:点击打开链接   http://blog.csdn.net/qq_32059827/article/details/52313516 首先,很荣幸此专栏能被CSDN推荐到主页.荣 ...

随机推荐

  1. Ubuntu 使用笔记

    持续更新 从前使用sudo apt update更新时, 发现软件源是cn.archive.ubuntu.com. 最近在system setting 中将软件源改成了archive.ubuntu.c ...

  2. 数据结构作业——N!的位数(斯特灵公式)

    Description 求N!的位数 Input 输入第一行为一个正整数 n(1<=n<=25000). Output 输出 n!的位数. Sample Input 1020 Sample ...

  3. ubuntu nginx 安装以及配置文件详解

    1.到nginx官网下载源码包.最好下载稳定版本,nginx官网http://www.nginx.org/ 2.安装nginx依赖包运行命令: sudo apt-get install libssl- ...

  4. 【Alpha版本】冲刺-Day3

    队伍:606notconnected 会议时间:11月11日 会议总结 张斯巍(433) 今天安排:个人信息界面设计 完成度:100% 明天计划:个人信息界面设计 遇到的问题:ps掌握的还不够熟练,导 ...

  5. JZOJ P1847:找01串

    传送门 DP预处理+贪心 首先设$f[i][j]$表示长度为$i$的01串中有不大于$j$个1,然后显然 $f[i][j]=\sum_{k=1} ^{j} C[i][k]$ $C[i][j]=C[i- ...

  6. zoj 3946 Highway Project(最短路 + 优先队列)

    Highway Project Time Limit: 2 Seconds      Memory Limit: 65536 KB Edward, the emperor of the Marjar ...

  7. css中关于居中的那点事儿

    css中关于居中的那点事儿 关于居中,无论是水平居中,还是垂直居中都有很多方式,下面我来介绍一些常用的. 第一部分:水平居中 1.实现行内元素的居中.方法:在行内元素外面的块元素的样式中添加:text ...

  8. JavaScript中的变量及数据类型

    转自:http://blog.csdn.net/mygis2005/article/details/7375419 JavaScript是一种弱类型的语言,变量名.操作符和方法名都区分大小写. 1.变 ...

  9. BZOJ3685: 普通van Emde Boas树

    显然这题的所有操作都可以用set,但是直接用set肯定要T,考虑到读入量较大,使用fread读入优化,就可以卡过去了. #include<bits/stdc++.h> using name ...

  10. oracle自定义判断数据是否为数值函数

    CREATE OR REPLACE FUNCTION isnumeric (str IN VARCHAR2) RETURN NUMBER IS v_str ); BEGIN IF str IS NUL ...