B2C电商平台开发心得(asp.net+bootstrap)

Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 html、css、javascript的,专为 web 应用设计,包含了移动设备优先的样式, 其响应式 css 能够自适应于台式机、平板电脑和手机,它简洁灵活,使得 web 开发更加快捷。

官方下载地址:
http://getbootstrap.com/

1.网格系统:

网格系统是通常可以想成横跨的十二个可用的列来创建的。

col-xs-12是超小屏(如 手机 )

col-sm-12是小屏(如 平板 )

col-md-12是中等屏(如 电脑桌面)

col-lg-12是超大屏(如 大桌面显示器)

如想在不同移动设备拥有一样的样式,可根据网格系统,设置在不同属性值 例如:

 1 <div id="K98HGT0A" runat="server" class="col-xs-12 col-sm-12 col-md-12 text-center text-padding">
 2             <div class="col-xs-1 col-sm-4 col-md-5">
 3             </div>
 4             <div class="col-xs-11 col-sm-8 col-md-7 text-left text-padding K98HGT0A" id="div_img"
 5                 runat="server">
 6                 <img alt="" src="../Images/expand.gif" class="img1" align="absmiddle" onclick="expandAll();"
 7                     style="padding-left: 20px; " />
 8                 <img alt="" src="../Images/collapse.gif" class="img2" align="absmiddle" onclick="collapseAll();"
 9                     style="padding-left: 20px;" />
10             </div>
11   </div>

 

2.客户端的返回按钮:

if (ViewState["UrlReferrer"] != null)
{
Response.Redirect(ViewState["UrlReferrer"].ToString());
}

 

只在第二页面及之后才会有效果。

3.跳转到其他页面: 使用的是 Response.Redirect

 1 protected void ibtnCart_Click(object sender, ImageClickEventArgs e)
 2     {
 3         string addpid = Common.GetAppIdByFilePath("Shopping_Cart.aspx");
 4         Response.Redirect("Shopping_Cart.aspx?APPID=" + addpid);
 5     }    
 6     #region 跳转到其他页面
 7     private void ResponseRedirect(string pageUrl, string appid, string iq)
 8     {
 9         StringBuilder strUrl = new StringBuilder();
10         strUrl.Append(pageUrl);
11         strUrl.Append("?appid=");
12         strUrl.Append(appid);
13         strUrl.Append("&iq=");
14         strUrl.Append(iq);
15         Response.Redirect(strUrl.ToString());
16     }
17     #endregion
18    

4.折叠效果: 使用两种不同的图片“+”“-”,在javascript中,点击两种图片(click事件),show/hide()显示/隐藏

5.页面动态加载(datetable动态新增一行还是物流动态等等情况)

 1   function addGvNoneRow() {
 2           if ($("#hdIQ").val() == "RP") {
 3               $("#gvNone_SRNO tr:not(:first)").each(function () {
 4                   var STATUSDESCR = $(this).find(".STATUSDESCR").text();
 5                   var CREATE_T = $(this).find(".CREATE_T").text();
 6                   if ($("#gvNone_SRNO tr").length == 1) {
 7                       var tableImgfirst = " <div class='col-xs-5 col-sm-6 col-md-6 text-right text-padding orderimg' id='orderimg'>"
 8                         + " <table class='pull-right' id='img'>"
 9                         + " <tr><td><img src='../Images/successful(2).png' /></td></tr></table></div>";
10 
11                       var tableListfirst = "<div class='col-xs-7 col-sm-6 col-md-6 text-left  text-padding orderlist' id='orderlist'>"
12                         + "<table class='pull-left list' id='list'>"
13                         + " <tr><td style='padding-bottom:10px;padding-left:15px;'><span id='lbSTATUSDESCR' style='font-size:XX-Small;'>" + STATUSDESCR + "</span>"
14                         + "<br />"
15                         + "<span id='lbCREATE_T' style='font-size:XX-Small;'>" + CREATE_T + "</span></td></tr></table></div><br/>";
16                       $("#div_img").after(tableImgfirst);
17                       $("#orderimg").after(tableListfirst);
18                   }19                 48               });
}

6.分页控件的应用(使用的是asp.net自带的分页控件AspNetPager)。

可以在AspNetPager设置按多少条数据分页。

HTML:
1  <div class="col-xs-9 col-md-7 col-lg-7  text-left text-padding fy_pager ">
2                 <page:AspNetPager runat="server" ID="pager" PageSize="5" OnPageChanged="Pager_PageChanged"
3                     HorizontalAlign="Center" Width="100%" ForeColor="White">
4                 </page:AspNetPager>
5             </div>
 后端:
 1     protected void Pager_PageChanged(object sender, EventArgs e)
 2     {
 3         string hdsono = "";
 4         string sqlPager = @"SELECT COUNT(*) FROM(
 5                             SELECT DISTINCT M_STS.SONO
 6                             FROM OMSO_M SO_M WITH(NOLOCK)
 7                             INNER JOIN OMSO_M_STS_LOG M_STS WITH(NOLOCK) ON SO_M.SONO=M_STS.SONO
 8                             INNER JOIN BD_STORE S WITH(NOLOCK) ON S.STORECD=@STORECD
 9                             INNER JOIN BD_SPROJECT PROJ WITH(NOLOCK) ON S.PROJCD=PROJ.PROJCD
10                             INNER JOIN SYSSTATUSCDL STS WITH(NOLOCK) ON STS.STATUSCD=M_STS.STATUSCD
11                             WHERE SO_M.CREATEBY=@USERID)AA";
12         SqlParameter[] parasPager = {
13          new SqlParameter("@STORECD",SqlDbType.NVarChar,20){Value=STORECD},
14          new SqlParameter("@USERID", SqlDbType.NVarChar, 15) { Value =SysSession.UserId}
15                                     };
16         object obj = DBAccess.ExecuteScalar(sqlPager, parasPager);
17         int intobj = Convert.ToInt32(obj);
18         if (intobj == 0)
19         {
20             string sqlPager1 = @"SELECT COUNT(*) FROM(
21                                     SELECT DISTINCT M_STS.SONO
22                                     FROM OMSO_M SO_M WITH(NOLOCK)
23 INNER JOIN OMSO_M_STS_LOG M_STS WITH(NOLOCK) ON SO_M.SONO=M_STS.SONO
24 INNER JOIN SYSSTATUSCDL STS WITH(NOLOCK) ON STS.STATUSCD=M_STS.STATUSCD
25 
26                                     WHERE SO_M.CREATEBY=@USERID AND STS.[LANGID]='en')AA";
27             SqlParameter parasPager1 = new SqlParameter("@USERID", SqlDbType.NVarChar, 15) { Value = SysSession.UserId };
28 
29             object obj1 = DBAccess.ExecuteScalar(sqlPager1, parasPager1);
30             pager.RecordCount = Convert.ToInt32(obj1);
31 
32             string sql1 = @"SELECT ROW_NUMBER() OVER (ORDER BY SONO)ROWNUM, SONO FROM (
33                                 SELECT DISTINCT M_STS.SONO
34                                FROM OMSO_M SO_M WITH(NOLOCK)
35 INNER JOIN OMSO_M_STS_LOG M_STS WITH(NOLOCK) ON SO_M.SONO=M_STS.SONO
36 INNER JOIN SYSSTATUSCDL STS WITH(NOLOCK) ON STS.STATUSCD=M_STS.STATUSCD
37 
38                                     WHERE SO_M.CREATEBY=@USERID AND STS.[LANGID]='en')AA";
39 
40             sql1 = @"SELECT * FROM ( " + sql1 + " )X WHERE ROWNUM BETWEEN @Start AND @End";
41 
42             SqlParameter[] paras1 = {        
43                          new SqlParameter("@USERID", SqlDbType.NVarChar, 15) { Value =SysSession.UserId} ,
44                          new SqlParameter("@Start",SqlDbType.Int){Value = pager.StartRecordIndex},
45                          new SqlParameter("@End", SqlDbType.Int){Value =pager.EndRecordIndex},
46                                             };
47             DataTable dt1 = DBAccess.ExecuteDataTable(sql1, paras1);
48             for (int i = 0; i < dt1.Rows.Count; i++)
49             {
50                 string sono = dt1.Rows[i]["SONO"].ConvertObjToStr();
51                 hdsono += sono + ",";
52             }
53             if (hdsono.Length > 0)
54             {
55                 hdsono = hdsono.Substring(0, hdsono.Length - 1);
56                 hdSONO.Value = hdsono;
57             }
58         }
59       } 

7.gridview中某字段内容过长,截取前*个字符,其后用……或“”代替,鼠标悬停在上面显示全部内容

1 <asp:TemplateField HeaderText="<%$ Resources:GlobalResource_Store,ItemName%>">
2 <ItemTemplate>
3 <asp:Label ID="lbPNDESCR" runat="server" Text='<%#Eval("PNDESCRtwo") %>' ToolTip='<%# Eval("PNDESCR") %>'></asp:Label>
4 </ItemTemplate>
5 </asp:TemplateField>
1  string sql = @"SELECT a.SRNO, b.CURR, b.SUMAMNT, a.PN,(substring(a.PNDESCR,0,20)) as PNDESCRtwo, a.PNDESCR, SUM(a.QTY) AS QTY, SUM(a.AMNT) AS ITEMAMNT
2                         FROM (
3                         SELECT SR_M.SRNO, M.QUOTNO, DA.QUOTITEM AS PN, DA.QUOTITEM AS PNDESCR, 1 AS QTY, DA.AMNT AS RPRIC, 1 AS DISCOUNT, DA.AMNT AS AMNT
4                         FROM SMEDB..OMSR_M SR_M WITH(NOLOCK)
5                         INNER JOIN SMEDB..OMSR_ADDR ADDR WITH(NOLOCK) ON SR_M.SRNO=ADDR.SRNO AND ADDR.ADDRTP='ST'
6                         INNER JOIN SMEDB..QUOT_M M WITH(NOLOCK) ON M.SRNO=SR_M.SRNO AND M.APPROVEFLAG='Y'
7                         INNER JOIN SMEDB..QUOT_DA DA WITH(NOLOCK) ON M.QUOTNO=DA.QUOTNO
……………………

8.RadioButton二选一时,设置两个RadioButton的属性groupName="**"的属性值相同。

 1         <div class="row row-margin-bottom">
 2             <div class="col-xs-2 col-sm-4 col-md-4 text-right text-left text-padding"> 
 3              </div>
 4             <div class="col-xs-10 col-sm-8 col-md-8 text-left text-padding">
 5             <asp:RadioButton runat="server" ID="rbtn_zfb" GroupName="zf"
 6                     oncheckedchanged="rbtn_zfb_CheckedChanged" AutoPostBack="True" />
 7                     <%= Resources.GlobalResource_Store.Alipay%>&nbsp;&nbsp;
 8             </div>
 9         </div>
10         <div class="row row-margin-bottom">
11             <div class="col-xs-2 col-sm-4 col-md-4 text-right text-padding">
12             </div>
13              <div class="col-xs-10 col-sm-8 col-md-8 text-left text-padding" ">   
14               <asp:RadioButton runat="server" ID="rbtn_xxhk" GroupName="zf" oncheckedchanged="rbtn_xxhk_CheckedChanged"  AutoPostBack="True" />
15                <%= Resources.GlobalResource_Store.Offline_remittance%>
16                 </div>            
17              </div>

9.dropdownlist 默认项设置为数据列的某个值:

 1 ddlTimeZone.Items.FindByText("UTC").Selected = true; 

 

posted @ 2017-01-22 10:25  Bonnie_W  阅读(3129)  评论(0编辑  收藏  举报