javascript+ajax实现产品页面加载信息


Posted in Javascript onJuly 09, 2015

js

//加载页面

//加载产品列表
function GetProductList() {
  function PostParam(param) {
    param.key = "lm324";
    return param;
  }
  var PostExecParam = {
    ClassName: "AnxinE.BLL.Product.ProductInfoBLL",
    MethodName: "Search",
    ParamModelName: "AnxinE.Model.Product.ProductInfoParam",
    onRequest: PostParam,
    onResponse: function (result) {
      if (result != null) {
        var html = "";
        //汇率判断
        //<td>" + (result.SupplierProductList[i].ProductList[j].PriceUSD.toString() == '0' ? 1 : result.SupplierProductList[i].ProductList[j].USDPriceList[0].MinQuantity) + ":" + result.SupplierProductList[i].ProductList[j].PriceUSD + "</td>
        //展示搜索-产品信息列表
        for (var i = 0; i < result.SupplierProductList.length; i++) {
          for (var j = 0; j < result.SupplierProductList[i].ProductList.length; j++) {
            //if (result.SupplierProductList[i].ProductList[j].PriceUSD!=null) {
            //}
            html += "<tr><td>" + result.SupplierProductList[i].ProductList[j].Model + "</td><td>" + result.SupplierProductList[i].ProductList[j].Manufacturer + "</td><td>" + (result.SupplierProductList[i].ProductList[j].Quantity) + "</td><td>" + result.SupplierProductList[i].ProductList[j].ShipDays + "</td><td>" + result.SupplierProductList[i].ProductList[j].MinOrderQuantity + "+</td><td>" + result.SupplierProductList[i].ProductList[i].DeliveryPoint + "</td><td>" + result.SupplierProductList[i].ProductList[j].PriceUSD + "</td><td>" + result.SupplierProductList[i].ProductList[j].PriceCNY + "</td><td><a href=''>加入购物车</td></tr><br/>";
          }
        }
        //展示搜索--品牌列表
        var html2 = "<h2 class='cur1'>全部</h2>";
        if (result.ManufacturerList.length > 0) {
          for (var i = 0; i < result.ManufacturerList.length ; i++) {
            if (result.ManufacturerList[i].KeyName != null) {
              if (i < 5) {
                html2 += "<h2 href='javascript:void(0);' id='" + result.ManufacturerList[i].KeyName + "' onclick='Trademark(this)' >" + result.ManufacturerList[i].KeyName + "</h2>";
              }
            }
          }
          //<a href="javascript:void(0);" id="regain_r2">收回</a>
          html2 += "<a href='javascript:void(0);' id='more_r2' onclick='More_r2()'>更多+</a>";
        }
        //不删除第一个内容,将产品信息表追加
        $("#r2_text2").not($(".cur1")).empty();
        $("#r2_text2").append(html2);
        //改写品牌行
        $(".tr3").empty();
        $(".tr3").append(html);
      }
    }
  };
  $.ajaxRequest(PostExecParam);
};

.cshtml

<div class="secect_r">
    <div class="top_right">
      <ul>
        <li class="list1"><img src="~/MvcImages/ycysqd/sx_03.gif" /><p>筛选</p></li>
        <li class="list2"><a href="">集成电路</a>>></li>
        @*<li class="list3"><a>INFINEON</a><span>×</span></li>
        <li class="list3"><a>100-1000件</a><span>×</span></li>
        <li class="list3"><a>国内</a><span>×</span></li>*@
      </ul>
      <div class="r1"><h1>型号:</h1><div class="text1"><input id="typeofproduct" type="text" value="输入型号" /></div></div>
      <div class="r2"><h1>品牌:</h1><div class="text2" id="r2_text2"><h2 class="cur1">全部</h2><h2>FTDI</h2><h2>WIINET</h2><h2>3M-STATIC CONTROL SOLUTIONS</h2><h2>AAVID THERMALLOY</h2><h2>ALLIANCE</h2><a href="javascript:void(0);" id="more_r2" onclick="More_r2()">更多+</a></div><div class="text2" id="r2_text2_2" style="display:none"></div></div>
      <div class="r3"><h1>库存数量:</h1><div class="text1"><input type="text" class="ChangeInventoryquantity" id="startnumber" value="1000" /></div><a>-</a><div class="text2"><input class="ChangeInventoryquantity" id="endnumber" type="text" value="1000000" /></div><a>件</a></div>
      <div class="r4"><h1>交货地:</h1><div class="text2"><h2 class="cur1">全部</h2><h2 onclick="Trademark(this)">国内</h2><h2 onclick="Trademark(this)">香港</h2></div></div>
    </div>

  </div>
  <table class="bottom_right">
    <tr class="tr1">
      <td class="td1"><p>型号</p></td>
      <td class="td2"><p>品牌</p></td>
      <td class="td3"><p>库存数量</p></td>
      <td class="td4"><p>货期</p></td>
      <td class="td5"><p>起订量</p></td>
      <td class="td6"><p>交货地</p></td>
      <td class="td7"><p>香港交货</p></td>
      <td class="td8"><p>国内交货</p></td>
      <td class="td9"><p>操作</p></td>
    </tr>
    <tr class="tr2">
      <td></td>
      <td></td>
      <td></td>
      <td><p>(工作日)</p></td>
      <td></td>
      <td></td>
      <td></td>
      <td><p>(含17%税)</p></td>
      <td></td>
    </tr>

    <tbody class="tr3"></tbody>

  </table>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
Jquery中国地图热点效果-鼠标经过弹出提示层信息的简单实例
Feb 12 Javascript
简单介绍JavaScript的变量和数据类型
Jun 03 Javascript
基于javascript实现图片左右切换效果
Jan 25 Javascript
Bootstrap每天必学之附加导航(Affix)插件
Apr 25 Javascript
jQuery图片切换动画特效
Nov 02 Javascript
微信JSSDK调用微信扫一扫功能的方法
Jul 25 Javascript
vue实现移动端图片裁剪上传功能
Aug 18 Javascript
Vue2.0学习之详解Vue 组件及父子组件通信
Dec 12 Javascript
Angular 4.x+Ionic3踩坑之Ionic 3.x界面传值详解
Mar 13 Javascript
解决vue项目使用font-awesome,build后路径的问题
Sep 01 Javascript
为nuxt项目写一个面包屑cli工具实现自动生成页面与面包屑配置
Sep 29 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 Javascript
浅谈JavaScript中null和undefined
Jul 09 #Javascript
兼容各大浏览器的JavaScript阻止事件冒泡代码
Jul 09 #Javascript
JavaScript包装对象使用详解
Jul 09 #Javascript
jquery实现表单验证并阻止非法提交
Jul 09 #Javascript
jQuery实现tab选项卡效果的方法
Jul 08 #Javascript
jQuery实现类似淘宝网图片放大效果的方法
Jul 08 #Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 #Javascript
You might like
老机欣赏|中国60年代精品收音机
2021/03/02 无线电
php入门小知识
2008/03/24 PHP
PHP生成json和xml类型接口数据格式
2015/05/17 PHP
php实现表单多按钮提交action的处理方法
2015/10/24 PHP
JavaScript使用prototype定义对象类型
2007/02/07 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
基于javascript 闭包基础分享
2013/07/10 Javascript
文档对象模型DOM通俗讲解
2013/11/01 Javascript
JS实现日期加减的方法
2013/11/29 Javascript
通过正则表达式实现表单验证是否为中文
2014/02/18 Javascript
jquery动态添加元素事件失效问题解决方法
2014/05/23 Javascript
jQuery中的pushStack实现原理和应用实例
2015/02/03 Javascript
简介JavaScript中fixed()方法的使用
2015/06/08 Javascript
Javascript字符串拼接小技巧(推荐)
2016/06/02 Javascript
完全深入学习Bootstrap表单
2016/11/28 Javascript
利用vue实现模态框组件
2016/12/19 Javascript
从组件封装看Vue的作用域插槽的实现
2019/02/12 Javascript
原生js实现贪食蛇小游戏的思路详解
2019/11/26 Javascript
Python中的ctime()方法使用教程
2015/05/22 Python
Python的组合模式与责任链模式编程示例
2016/02/02 Python
Django中Model的使用方法教程
2018/03/07 Python
python实现猜数字小游戏
2020/03/24 Python
python通过对字典的排序,对json字段进行排序的实例
2020/02/27 Python
Tensorflow tf.tile()的用法实例分析
2020/05/22 Python
Python爬虫之Selenium实现键盘事件
2020/12/04 Python
css3之UI元素状态伪类选择器实例演示
2017/08/11 HTML / CSS
俄罗斯眼镜网: optikaworld
2016/07/31 全球购物
迪奥美国官网:Dior美国
2019/12/07 全球购物
初一学生期末评语
2014/04/24 职场文书
初中英语演讲稿
2014/04/29 职场文书
社区反邪教工作方案
2014/06/16 职场文书
教师三严三实心得体会
2014/10/11 职场文书
高中生军训感言
2015/08/01 职场文书
2016教师年度考核评语大全
2015/12/01 职场文书
党章学习心得体会2016
2016/01/14 职场文书
CSS 鼠标选中文字后改变背景色的实现代码
2023/05/21 HTML / CSS