FineUI 官方论坛

标题: 【已解决】TextBox无法绑定js软键盘插件 [打印本页]
作者: wendy蛇蛇    时间: 2017-8-22 14:35
标题: 【已解决】TextBox无法绑定js软键盘插件
在网上找了一个js写的软键盘，想要绑定到textbox上，但是无法实现。
试了一下html的input框，却是可以实现的。
语句在图中展示。
其中只有 tbxUseraName2 绑定成功了。
想知道是什么原因，谢谢
作者: wendy蛇蛇    时间: 2017-8-22 14:38
回复怎么不能贴本地图片

作者: sanshi    时间: 2017-8-22 15:11
请把示例放到空项目中，保证能运行，并上传。方便调试解决
作者: sanshi    时间: 2017-8-23 21:33
这个其实不难，有几点需要注意：
1. 所有自定义JS引用和代码都要放到页面的最底部（</body>之前）
2. 所有初始化JS代码放到 F.ready(function() { ... }) 中，而不是 $(function() { ... })
3. 注意 FineUI 的 TextBox 控件渲染出来的控件有层次结构，不是简单的 input 节点

完整可运行的示例：
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="VertualKeyBoard.aspx.cs" Inherits="EmptyProjectNet40_FineUI.VertualKeyBoard" %>

  3. <!DOCTYPE html>

  5. <html>
  6. <head runat="server">
  7.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  9.     <title></title>
  10.     <link href="../vk/css/keyboard.css" rel="stylesheet" />
  11.     <style>
  12.         .ui-keyboard-preview {
  13.             border: solid 1px #ccc;
  14.         }
  15.     </style>
  16. </head>
  17. <body>
  18.     <form id="form1" runat="server">
  19.         <f:PageManager ID="PageManager1" runat="server" />

  21.         <f:TextBox runat="server" Label="用户名" ID="tbxUseraName">
  22.         </f:TextBox>

  24.     </form>
  25.     <div>
  26.         <label>用户名：  </label>
  27.         <input id="tbxUseraName2" />
  28.     </div>

  30.     <script src="../vk/jquery-1.8.0.min.js"></script>
  31.     <script src="../vk/jquery-ui.min.js"></script>

  33.     <script src="../vk/js/jquery.keyboard.js"></script>
  34.     <script src="../vk/js/jquery.mousewheel.js"></script>

  36.     <script>
  37.         var tbxUseraNameClientID = '<%= tbxUseraName.ClientID %>';

  39.         F.ready(function () {
  40.             $('#' + tbxUseraNameClientID + ' input').keyboard();
  41.             $('#tbxUseraName2').keyboard();
  42.         })
  43.     </script>
  44. </body>
  45. </html>

复制代码


作者: wendy蛇蛇    时间: 2017-8-24 09:24
sanshi 发表于 2017-8-23 21:33
这个其实不难，有几点需要注意：
1. 所有自定义JS引用和代码都要放到页面的最底部（之前）
2. 所有初始化JS ...

问题解决了，谢谢三石大神！
作者: wendy蛇蛇    时间: 2017-8-24 16:26
sanshi 发表于 2017-8-23 21:33
这个其实不难，有几点需要注意：
1. 所有自定义JS引用和代码都要放到页面的最底部（之前）
2. 所有初始化JS ...

大神，还有个问题，在表格中绑定软键盘的语句应该怎么写呢
表格中有一栏
               <f:RenderField Width="100px" ColumnID="Major" DataField="Major" FieldType="String"
                    ExpandUnusedSpace="true" HeaderText="所学专业">
                    <Editor>
                        <f:TextBox ID="tbxEditorMajor" Required="true" runat="server">
                        </f:TextBox>
                    </Editor>
                </f:RenderField>
需要软键盘
作者: sanshi    时间: 2017-8-24 22:07
wendy蛇蛇 发表于 2017-8-24 16:26
大神，还有个问题，在表格中绑定软键盘的语句应该怎么写呢
表格中有一栏
               

一样的道理，表格中的TextBox也是一个独立的控件，先自己尝试一下



欢迎光临 FineUI 官方论坛 (https://fineui.com/bbs/) Powered by Discuz! X3.4