捕获页面标题的通用方法,控制标签

Generic Way of Capturing Page Title, Control labels

本文关键字:方法 控制 标签 标题      更新时间:2023-09-26

我们的一个客户有一个新的需求,动态捕获页面/屏幕标题和用户交互页面上所有控件(文本框,复选框,单选按钮,普通按钮,链接,图像,菜单/菜单项)的标签,然后将它们推送到excel文件。

如果客户导航/打开页面a,并在文本框Name = John中设置一个值,启用复选框chbox/单选按钮Rbutton,然后最后单击保存/提交按钮,那么预计会出现以下输出。用户操作和结果是Excel文件的前两列。

     **User Action**                               **Result**
      Open Page/Screen A                            Page/Screen A is displayed
      Set textbox Name = John                       Field Name is set successfully
      Set  ChBox = true                             ChBox is enabled successfully
      Set Rbutton = true                            Rbutton is enabled successfully
      Click Submit button                           Page B is displayed

只是想知道是否有可能实现这种捕获任何页面的用户交互的通用方法。

只是一个想法:你可以监听所有事件(例如使用jquery),然后为每个"有趣的"事件发布ajax请求(你必须过滤…),将其存储在数据库中,然后添加csv或excel格式的"导出"功能。

可能会有一些性能问题,这取决于页面,事件和用户的数量…

使用类名来过滤的想法是好的,感谢Hasan Iqbal Anik。

Javascript无法访问硬盘驱动器中的文件。但是,您可以捕获数据,创建模型,然后使用ajax调用将其存储在服务器中。

的一些想法:

  1. 使用在整个应用程序视图中呈现的布局或母版页
  2. 给所有的页面标签,按钮,复选框和任何你需要存储的信息相同的类名。
  3. 在主/布局页面中使用一些jquery魔法来获取这些元素的值并创建一个数组。
  4. 通过ajax调用向服务器发送该数组。

现在您可以获得大量关于如何使用jquery获取元素值的示例。我是在帮你避免付出。希望这对你有所帮助……: D

//编辑:我正试着按照Steve的要求扩展我的答案。

<form action="someAction" id="myForm">
Name: <input type="text" class="Name">
Checkbox: <input type="checkbox" class="ChBox"/>Click this box
RButton: <input class="Rbutton" type="radio" />
Submit: <input type="submit" class="submit"/>
</form>

现在一些jquery:

$(function() {
     $(".submit").click(function(){
var dataToSend = new Object();
dataToSend.pageUrl = window.location.pathname + " is displayed";
if ($(".Name").val().length > 0) {
dataToSend.Name = "Field Name is set successfully";
}
else {
dataToSend.Name = "Field Name is empty";
}
if($(".ChBox").is(':checked')){dataToSend.ChBox = "ChBox is enabled successfully";}
else{dataToSend.ChBox = "ChBox is not enabled";}
if($(".Rbutton").is(':checked')){dataToSend.Rbutton = "Rbutton is enabled successfully";}
else{dataToSend.Rbutton = "Rbutton is not checked";}
dataToSend.Submit = $("#myForm").attr['action'] + " is displayed";
});

//now send it to the server via ajax
$.ajax({
 type: "POST",
 url: "your server action url that would make excel file with these data",
 data: dataToSend,
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 success: function(msg) {
//do as you wish
 }
});
    });