-3

我想將Google表格電子表格嵌入到我的網站。我希望這樣,用戶可以訪問我的網站,他們可以查看電子表格並與其交互。電子表格還包含一些公式。例如,有在該薄片一個在網站中嵌入交互式Google表單而不讓用戶保存更改[PHP,HTML]

width, height , fabric , price

。面料是一個下拉菜單,它包含一些不同價格的面料。 用於計算價格的公式是:

height*width*fabric value

所以每當用戶增加的寬度,高度,並且選擇織物然後將其輸出在價格字段對應的值。

因此,我想將此Google表格嵌入到我的網站,以便用戶可以使用它來計算價格而不保存到原始電子表格。 我有一個php網站。如果我們無法使用Google表格執行此操作,那麼是否有任何方法將此Excel表單上傳到我的網站並執行相同的操作?

請幫忙。

+0

如果你只需要一個黑客,並且不需要程序上的答案,那麼請刪除'php'標籤。 –

+0

如果我們可以通過編程的方式做到這一點,那麼它比使用谷歌表格更好。 –

+0

檢查答案。 –

回答

1

我想我明白你的意思,但我不完全確定。 從你的問題說我假設:

  • 你有一個工作的谷歌試算表。
  • 你有一個網站,你想把這個電子表格嵌入到你的網站。
  • 你希望人們能夠與電子表格交互,但不改變配方,等...

好了,我想你這裏有兩個主要選擇:

選項1 :嵌入權限電子表格

我意識到你已經試過這個選項,它不工作。請參閱選項2.第一個選項涉及獲取您已經制作的電子表格並對其添加一些編輯權限。我猜測在你的電子表格中你有一個數據驗證單元格(創建下拉菜單,如果沒有,請說明這是如何完成的),並且這是用戶選擇一個數量輸入到你的算法。如果是這種情況,那麼您想要做的是這樣的:

  1. 在Google表格中打開電子表格並轉到您希望人們與其交互的表格。
  2. 沿屏幕底部找到當前表單,然後單擊名稱旁邊的小黑箭頭。然後點擊「保護表」。
  3. 應在右側打開一個新窗口。 (Screenshot of the 'Protect Sheet' Window)在這個新窗口中,點擊「工作表」,然後在下面的下拉列表中選擇用戶與之交互的工作表。
  4. 接下來,勾選'除特定單元格'框外。在新框中,輸入對用戶輸入單元格的引用。如果您有多個單元格,請單擊「添加另一個範圍」,然後將此新框用於其他單元格引用。完成此操作後,請點擊「設置權限」。當出現新窗口時,請檢查是否勾選了「限制誰可以編輯此頁面」選項,並在下面顯示「只有您」。然後點擊「完成」。
  5. 現在,要嵌入此文件,您需要做的是轉到左上角的「文件」選項卡並單擊「發佈到網絡」。出現窗口時,選擇「嵌入」,然後在下拉列表中選擇用戶將與之交互的頁面。然後點擊「發佈」,希望你會得到一個可以在你的網站上使用的嵌入代碼。 請試試看,並找回你的結果。

選項2:JavaScript表單

我已經發現了一些HTML在線和我增加了一些功能,以滿足您的需求。請運行下面的代碼,看看它是否適用於您,如果可以,請將其複製並粘貼到您的網站構建器的HTML片段中。要更改面料和價格,只需進入代碼並在''標籤中進行編輯。如果您需要幫助,請提問。

<!doctype HTML> 
 
<html`enter code here` lang="en"> 
 
\t <meta charset="utf-8"> 
 
\t <meta http-equiv="X-UA-Compatible"> 
 
\t <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
<title> 
 
Fabric price calculator 
 
</title> 
 
<head> 
 
<style> 
 
body { 
 
\t font-family: sans-serif; 
 
\t color: black; 
 
} 
 
input[type="text"] { 
 
    color: black; 
 
} 
 

 
</style> 
 
</head> 
 
<body> 
 
\t \t <h2>Fabric price calculator</h2> \t 
 
\t \t <form role="form" id="price" name="price"> \t 
 
\t \t <p>Select fabric type:</p> 
 
\t \t <select class="" id="itemselect" onchange="calculate()"> 
 
\t \t \t <option id="itemprice" value="1.500">Cotton @ £1.50/sq. m</option> 
 
\t \t \t <option id="itemprice" value="1.250">Denim @ £1.25/sq. m</option> 
 
\t \t \t <option id="itemprice" value="3.000">Wool @ £3.00/sq. m</option> 
 
\t \t \t <option id="itemprice" value="6.000">Silk @ £6.00/sq. m</option> 
 
\t \t \t <option id="itemprice" value="4.000">Leather @ £4.00/sq. m</option> 
 
\t \t \t <option id="itemprice" value="5.000">Nylon @ £5.00/sq. m</option> 
 
\t \t </select> 
 
\t \t <p>Enter length and width of fabric:</p> 
 
\t \t <p><input type="number" id="qty" onchange="calculate()" value="" placeholder="Length (m)"></p> 
 
\t \t <p><input type="number" id="qtya" onchange="calculate()" value="" placeholder="Width (m)"></p> 
 
\t \t <p>Total price of fabric:</p> 
 
\t \t <p><input type="text" id="result" value="" readonly="readonly"></p> \t \t 
 
\t </form> 
 
\t 
 
\t <script type="text/javascript"> 
 
\t \t function calculate(price){ 
 
\t \t \t var item = document.getElementById("itemselect").value || 0; 
 
\t \t \t var qty = document.getElementById("qty").value || 0; 
 
\t \t \t var qtya = document.getElementById("qtya").value || 0; 
 
\t \t \t 
 
\t \t \t item = parseFloat(item).toFixed(2); 
 
\t \t \t qty = parseFloat(qty).toFixed(2); 
 
\t \t \t qtya = parseFloat(qtya).toFixed(2); 
 
\t \t \t 
 
\t \t \t var result = parseFloat(item*qty*qtya).toFixed(2); 
 
\t \t \t \t \t \t \t 
 
\t \t \t document.getElementById("result").value="£"+result; 
 
\t \t } 
 
\t </script> 
 
</body> 
 
</html>

我希望這所有的作品!

penguin_k

+0

你看過我的回答嗎?我認爲這是你要找的,但我需要你檢查。 –

+1

這裏我不想使用選項2.在選項上,當我在網站上分享這個excell,然後使用可以添加他們的輸入和計算價值。但是,什麼用戶添加輸入保存在我的Excel表。這我不想要。他們可以使用工作表,而不需要保存任何東西到原來的excell工作表。 –

+0

不幸的是,我們可以用谷歌表做的最好的選擇是1.你的網站會有多忙? –

1

這個問題非常含糊。 Google Cheats既不是可編程的,也不是面向API的服務。您的需求是一個提供Excel的所有功能的腳本,但不應該允許CTRL + S.I表示保存更改。

以下是讓基於Web的電子表格應用程序庫: - [請參閱此鏈接] https://jspreadsheets.com

Handsontable似乎很有前途,但也有很多可用的庫,你必須給搜索。 https://jspreadsheets.com/handsontable.html

0

我認爲你應該做的只是爲每個用戶製作一份模板或基礎電子表格的副本,以便保存或不保存它們:每個用戶都可以在自己的副本上工作。

最終跟蹤副本,以便您可以定期垃圾它們(垃圾收集)。

看看谷歌驅動的API的COPY方法:

https://developers.google.com/drive/v2/reference/files/copy

示例代碼在PHP中:

/** 
* Copy an existing file. 
* 
* @param Google_Service_Drive $service Drive API service instance. 
* @param String $originFileId ID of the origin file to copy. 
* @param String $copyTitle Title of the copy. 
* @return DriveFile The copied file. NULL is returned if an API error occurred. 
*/ 
function copyFile($service, $originFileId, $copyTitle) { 
    $copiedFile = new Google_Service_Drive_DriveFile(); 
    $copiedFile->setTitle($copyTitle); 
    try { 
    return $service->files->copy($originFileId, $copiedFile); 
    } catch (Exception $e) { 
    print "An error occurred: " . $e->getMessage(); 
    } 
    return NULL; 
} 

請注意,你需要的權限,但在服務器端。只是不要使用關鍵的帳戶,所以你保持安全的情況下服務器的安全。

+0

這是不實際的。 –

+0

不,我不這是你想要的。 –

+0

如果您使用的是Google表格,並且不希望將Google的API用於您的編程目的,則請勿使用Google表格。 – Fabien