gpt4 book ai didi

javascript - 在 jquery 中读取和使用用户输入数据

转载 作者:行者123 更新时间:2023-12-01 05:15:30 24 4
gpt4 key购买 nike

我正在关注https://tableau.github.io/webdataconnector/docs/wdc_multi_table_tutorial我想从用户那里获取某些参数并相应地创建一个网址。这是我的代码

<html>
<head>
<title>USGS Earthquake Feed</title>
<meta http-equiv="Cache-Control" content="no-store" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7"
crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
crossorigin="anonymous"></script>
<script src="https://connectors.tableau.com/libs/tableauwdc-2.3.latest.js" type="text/javascript"></script>
<script>
(function () {
// Create the connector object
var myConnector = tableau.makeConnector();
myConnector.getSchema = function (schemaCallback) {
var cols = [{
id: "MONTH",
dataType: tableau.dataTypeEnum.string
}, {
id: "METRICKEY",
alias: "METRICKEY",
dataType: tableau.dataTypeEnum.string
}, {
id: "NUMERATOR",
alias: "NUMERATOR",
dataType: tableau.dataTypeEnum.float
}, {
id: "DENOMINATOR",
dataType: tableau.dataTypeEnum.float
}];

var tableSchema = {
id: "feed",
alias: "Feed",
columns: cols
};

schemaCallback([tableSchema]);
};

myConnector.getData = function (table, doneCallback) {
var filters = tableau.filters;
console.log("filters");
console.log(tableau.filters);
var projections = tableau.projections;
var apicallUrl = 'test/?name=nb&filters=' + filters + '&projections=' + projections;
console.log(apicallUrl);
$.getJSON(apicallUrl, function (resp) {
var feat = resp.DATA,
tableData = [];
// Iterate over the JSON object
for (var i = 0, len = feat.length; i < len; i++) {
tableData.push({
"MONTH": feat[i].MONTH,
"METRICKEY": feat[i].METRICKEY,
"NUMERATOR": feat[i].NUMERATOR,
"DENOMINATOR": feat[i].DENOMINATOR
});
}
table.appendRows(tableData);
doneCallback();
});
};
tableau.registerConnector(myConnector);
$(document).ready(function () {
$("#submitButton").click(function () {
var filters = $('#filters').val().trim();
var projections = $('#projections').val().trim();
tableau.filters = JSON.stringify(filters);
tableau.projections = projections;
tableau.submit();
});
});
})();
</script>
</head>
<body>
<div class="container container-table">
<div class="row vertical-center-row">
<div class="text-center col-md-4 col-md-offset-4">
<h2>Get Earthquake Data for a Time Range</h2>
<form>
<div class="form-inline">
<label for="start-date-one" class="text-center">filters</label>
<span>&mdash;</span>
<label for="end-date-one">projections</label>
</div>
<div class="form-inline">
<input type="text" class="form-control" id="filters" value="">
<input type="text" class="form-control" id="projections" value="">
</div>
</form>
<button type="button" id="submitButton" class="btn btn-success" style="margin: 10px;">Get Earthquake Data!</button>
<div id="errorMsg"></div>
</div>
</div>
</div>
</body>
</html>

我正在尝试获取用户数据 tableau.filters 和 tableau.projections 参数,但是当我尝试在 get dat 函数中读取它们时,这些值未定义。知道为什么会发生这种情况吗?

是否有任何通用方法来获取用户数据并在 jquery 中的其他函数中使用它,我可以在这里使用?

投影和过滤器是文本框,我在 $(document).ready 的代码中读取它们的值。当我在此函数中打印 tableau.filters 和 tableau.projection 值时,我会得到这些值,但是当我在 getdata() 中打印这些值时,它会显示为未定义。

谢谢

最佳答案

我找到了解决方案这是一个愚蠢的问题我们必须将数据写入tableau对象的connectionData或connectionName参数。

$(document).ready(function() {
$("#submitButton").click(function() {
var urlObject = {
filters: $("#filters").val().trim(),
projections: $("#projections").val().trim(),
};
tableau.connectionData = JSON.stringify(urlObject);
tableau.submit();

});
});

关于javascript - 在 jquery 中读取和使用用户输入数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49772209/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com