Hướng dẫn pass arguments to html file - truyền đối số vào tệp html

Question

Cách an toàn nhất là truyền dữ liệu cần thiết cho HTML trực tiếp. Nếu bạn sử dụng các thuộc tính hoặc dịch vụ bộ đệm, nó có thể trở nên phức tạp hoặc thất bại dưới nhiều người dùng đồng thời. Có nhiều kỹ thuật để chuyển một đối tượng ban đầu từ máy chủ (.G) cho máy khách (.html).
There are many techniques to pass an initial object from the server (.gs) to the client (.html).

Nội dung chính Show

Gửi trang
Lưu ý: Các biến người dùng và công ty có thể được sử dụng để truyền thông tin chi tiết người dùng hiện tại và chi tiết công ty của họ.
Làm thế nào để bạn chuyển một đối số cho một hàm trong HTML?
Làm thế nào để bạn vượt qua một giá trị trong HTML?
Làm thế nào để bạn vượt qua các biến giữa các trang HTML?
Làm thế nào để bạn vượt qua các tham số?

Sử dụng HTMLTEMPLATE, bạn có thể làm: //.gs tệp
//.gs file

function doGet() {
    var htmlTemplate = HtmlService.createTemplateFromFile('template-client');
    htmlTemplate.dataFromServerTemplate = { first: "hello", last: "world" };
    var htmlOutput = htmlTemplate.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME)
        .setTitle('sample');
    return htmlOutput;
}

và trong tệp mẫu của bạn-client.html:

<!DOCTYPE html>

<script>
    var data = <?!= JSON.stringify(dataFromServerTemplate) ?>; //Stores the data directly in the javascript code
    // sample usage
    function initialize() {
        document.getElementById("myTitle").innerText = data.first + " - " + data.last;
        //or use jquery:  $("#myTitle").text(data.first + " - " + data.last);
    }
    // use onload or use jquery to call your initialization after the document loads
    window.onload = initialize;
</script>


<html>
<body>
    <H2 id="myTitle"></H2>
</body>
</html>

Cũng có thể làm điều đó mà không cần sử dụng khuôn mẫu, bằng cách nối thêm một div ẩn vào htmloutput:

//.gs tệp:

function appendDataToHtmlOutput(data, htmlOutput, idData) {
    if (!idData)
        idData = "mydata_htmlservice";

    // data is encoded after stringifying to guarantee a safe string that will never conflict with the html.
    // downside: increases the storage size by about 30%. If that is a concern (when passing huge objects) you may use base94
    // or even base128 encoding but that requires more code and can have issues, see http://stackoverflow.com/questions/6008047/why-dont-people-use-base128
    var strAppend = "<div id='" + idData + "' style='display:none;'>" + Utilities.base64Encode(JSON.stringify(data)) + "</div>";
    return htmlOutput.append(strAppend);
}


// sample usage:
function doGet() {
    var htmlOutput = HtmlService.createHtmlOutputFromFile('html-sample')
        .setSandboxMode(HtmlService.SandboxMode.IFRAME)
        .setTitle('sample');

    // data can be any (serializable) javascript object.
    // if your data is a native value (like a single number) pass an object like {num:myNumber}
    var data = { first: "hello", last: "world" };
    // appendDataToHtmlOutput modifies the html and returns the same htmlOutput object
    return appendDataToHtmlOutput(data, htmlOutput);
}

và trong đầu ra của bạn-client.html:

<!DOCTYPE html>
<script>
    /**
    * getDataFromHtml
    *
    * Inputs
    * idData: optional. id for the data element. defaults to "mydata_htmlservice"
    *
    * Returns
    * The stored data object
    */
    function getDataFromHtml(idData) {
        if (!idData)
            idData = "mydata_htmlservice";
        var dataEncoded = document.getElementById(idData).innerHTML;
        var data = JSON.parse(atob(dataEncoded));
        return data;
    }
    // sample usage of getDataFromHtml
    function initialize() {
        var data = getDataFromHtml();
        document.getElementById("myTitle").innerText = data.first + " - " + data.last;
        //or use jquery:  $("#myTitle").text(data.first + " - " + data.last);
    }
    // use onload or use jquery to call your initialization after the document loads
    window.onload = initialize;
</script>
<html>
<body>
    <H2 id="myTitle"></H2>
</body>
</html>

Cả hai phương pháp đều được so sánh và được giải thích tốt hơn trong GitHub nhỏ này tôi đã thực hiện: https://github.com/zmandel/htmlservice-get-set-data

Sử dụng một số kỹ thuật, bạn có thể truyền một giá trị (được gọi là tham số) từ trang này sang trang khác để phổ biến các trường biểu mẫu hoặc hiển thị trên trang HTML.

Gửi trang

Các giá trị có thể được gửi từ trang (gửi) ban đầu bằng cách tạo một liên kết đến trang đích bao gồm các tham số liên kết các biến sẽ được truyền. Chúng sau đó được phân tích cú pháp bởi trang nhận trở lại vào các giá trị.

Syntax:

/urltopage?var1=@variable1@&var2=@variable2@

Where:

URLTOPAGE là URL tương đối đến trang đích.
Biến1, biến2, v.v. là các tên biến (ví dụ: @firstName @).
var1, var1 tên tương ứng cho các biến

Examples:

Cổng thông tin

Tạo một phím tắt cổng thông tin và liên kết liên kết với phím tắt đó.

/urltopage?var1=@variable1@&var2=@variable2@

Cái nút

Tạo chỉ đọc - Trường tùy chỉnh biến hệ thống với:

 <input type="button" class=Button value="Button Label" 
 onClick='parent.location.href="/urltopage?var1=@variable1@&var2=@variable2@"'/>

Siêu liên kết

Tạo chỉ đọc - Trường tùy chỉnh biến hệ thống với:

<a href="/urltopage?var1=@variable1@&var2=@variable2@">Click Here</a>

Siêu liên kết: User and Company variables can be used to pass the current logged in user details and their company details.

Lưu ý: Các biến người dùng và công ty có thể được sử dụng để truyền thông tin chi tiết người dùng hiện tại và chi tiết công ty của họ.

Nhận trang

Trên trang nhận, các tham số có thể phổ biến trước một biểu mẫu hoặc phần tử HTML nằm trên trang đó. Để đạt được điều này, các chức năng JavaScript sau đây có thể được sử dụng.

function getParams() {
var idx = document.URL.indexOf('?');
var params = new Array();
if (idx != -1) {
var pairs = document.URL.substring(idx+1, document.URL.length).split('&');
for (var i=0; i<pairs.length; i++) {
nameVal = pairs[i].split('=');
params[nameVal[0]] = nameVal[1];
   }
}
return params;
}
params = getParams();

Đặt hàm đầu tiên sau vào đầu HTML.

Đặt một trong các chức năng thứ hai sau đây trong cơ thể ngay trước khi đóng thẻ cơ thể ().

<script>

var para1=document.getElementById('field1');
var para2=document.getElementById('field2');

para1.value = unescape(params["var1"]);
para2.value = unescape(params["var2"]);


</script>

Dân số thực địa

<script>

var para1=document.getElementById('element1');
var para2=document.getElementById('element2');

para1.value = unescape(params["var1"]);
para2.value = unescape(params["var2"]);

</script>

Dân số nguyên tố HTML (ví dụ:)

Thay thế "Field1" hoặc "Element1", v.v. bằng tên ID hoặc phần tử thực tế và "var1" bằng tên tham số.

ví dụ.

var para1 = document.getEuityById ('FirstName');

hoặc

ví dụ.

var para1 = document.getEuityById ('FirstName');

hoặc

SmartSimple sẽ thay thế các tham chiếu biến (@lastname@, v.v.) bằng các giá trị xuất phát từ phiên người dùng hiện tại.

Làm thế nào để bạn chuyển một đối số cho một hàm trong HTML?

Sử dụng thuộc tính Onclick trong thẻ nút với tên chức năng và giá trị truyền trong hàm này. Với phương thức này, bạn cũng có thể lấy đầu vào từ người dùng và truyền các tham số trong hàm JavaScript từ HTML.. With this method, you can also take input from users and pass parameters in the JavaScript function from HTML.

Làm thế nào để bạn vượt qua một giá trị trong HTML?

Để gửi dữ liệu đến hai servelet, hãy tạo một nút dưới dạng gửi và nút còn lại là nút.Trên nút đầu tiên, hãy gửi hành động trong thẻ biểu mẫu của bạn như bình thường, nhưng trên nút khác, hãy gọi hàm JavaScript ở đây, bạn phải gửi biểu mẫu có cùng trường nhưng đến các servels khác nhau sau đó viết một thẻ biểu mẫu khác sau khi đóng lần đầu tiên.

Làm thế nào để bạn vượt qua các biến giữa các trang HTML?

Có hai cách để vượt qua các biến giữa các trang web.Phương pháp đầu tiên là sử dụng sessionStorage hoặc localStorage.Phương pháp thứ hai là sử dụng chuỗi truy vấn với URL.use sessionStorage, or localStorage. The second method is to use a query string with the URL.

Làm thế nào để bạn vượt qua các tham số?

Tham số truyền liên quan đến việc chuyển các tham số đầu vào vào một mô -đun (một hàm trong C và một hàm và quy trình trong pascal) và nhận các tham số đầu ra trở lại từ mô -đun.Ví dụ, một mô -đun phương trình bậc hai yêu cầu ba tham số được truyền cho nó, đây sẽ là A, B và C.passing input parameters into a module (a function in C and a function and procedure in Pascal) and receiving output parameters back from the module. For example a quadratic equation module requires three parameters to be passed to it, these would be a, b and c.

programming html URL parameters