如何正确使用 eel 将下拉值从 javascrpt 传递到 python？

Question

read this : Pass JavaScript Variable Value to Python with Eel阅读本文：使用 Eel 将 JavaScript 变量值传递给 Python

read this : https://github.com/ChrisKnott/Eel阅读： https : //github.com/ChrisKnott/Eel

hi,你好，

i am creating a GUI using python EEL我正在使用 python EEL 创建一个 GUI

In this UI i have a drop down .在这个 UI 中，我有一个下拉菜单。 user will select the value of dropdown and submit and that dropdown value will reflect in python console.用户将选择下拉列表的值并提交，该下拉值将反映在 python 控制台中。

but i am unable to receive value from javascript但我无法从 javascript 接收价值

this is my python code:这是我的python代码：

from random import randint
import eel
  
eel.init("web")  
  
# Exposing the random_python function to javascript
@eel.expose    
def random_python():
    print("Random function running")
    return randint(1,100)


@eel.expose
def getList():
    lst = ["a","b","c","d"]
    return lst
  
eel.spawn(eel.js_myval()())
    

eel.start("index.html")

this is my javascript:这是我的javascript：

let lst =document.getElementById("cate") 
document.getElementById("submit").addEventListener("click",()=>{
        eel.expose(js_myval)// here i am using eel expose
        function js_myval(){
            return lst.value;
    }
       
    
    })

this is my html:这是我的 html：

    <select name="meesho_category" id="cate">
        <option value="x">x</option>
        <option value="x">a</option>
        <option value="x">b</option>

    </select>

Answer 1

I'm going to answer your narrow question about passing the dropdown value from JavaScript to Python, and ignore code that isn't related to that question.我将回答您关于将下拉值从 JavaScript 传递到 Python 的狭隘问题，并忽略与该问题无关的代码。

First, let's rewrite your JavaScript like this so it focuses on your question:首先，让我们像这样重写您的 JavaScript，使其专注于您的问题：

document.getElementById("btn-submit").addEventListener("click",()=>{submit()}, false);

function submit() {
    eel.on_submit(document.getElementById("cate").value)
}

That JavaScript code defines a click handler for the btn-submit button, which will read the value of cate dropdown and send it to Python code.该 JavaScript 代码为btn-submit按钮定义了一个单击处理程序，它将读取cate下拉列表的值并将其发送到 Python 代码。

Next, let's do the same trim down of the Python file:接下来，让我们对 Python 文件进行相同的修剪：

import eel
  
eel.init("web")

@eel.expose
def on_submit(cate_dropdown_val):
    print(f"cate val submitted: {cate_dropdown_val}")

eel.start("index.html")

This code exposes the on_submit function from Python to JavaScript.此代码将on_submit函数从 Python 公开到 JavaScript。 You'll notice it's being called in the JavaScript block listed above inside of the submit function.您会注意到它在上面列出的submit函数内的 JavaScript 块中被调用。

Lastly, let's look at the HTML:最后，让我们看一下 HTML：

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="eel.js"></script>        
    </head>
    <body>
        <select name="meesho_category" id="cate">
            <option value="x">x</option>
            <option value="a">a</option>
            <option value="b">b</option>    
        </select>
        <button id="btn-submit">Submit</button>
    </body>
    <script type="text/javascript" src="js/app.js"></script>
</html>

This HTML defines the cate dropdown element, a Submit button, and imports the eel.js and custom app.js shown above.此HTML定义cate下拉元件，提交按钮，进口eel.js和定制app.js如上所示。

When the application is run, and a user clicks the submit button, the Python console will print out the value of the cate dropdown to the console.当应用程序运行时，用户单击提交按钮，Python 控制台会将cate下拉列表的值打印到控制台。

From the other code in your example, it looks like you want to build more stuff.从您示例中的其他代码来看，您似乎想要构建更多东西。 Please open a new question with the additional help you might need.请使用您可能需要的其他帮助打开一个新问题。

如何正确使用 eel 将下拉值从 javascrpt 传递到 python？

问题描述

1 个解决方案

解决方案1
1 已采纳 2021-07-27 00:45:24

如何正确使用 eel 将下拉值从 javascrpt 传递到 python？

问题描述

1 个解决方案

解决方案1 1 已采纳 2021-07-27 00:45:24

解决方案1
1 已采纳 2021-07-27 00:45:24