input example readme
This commit is contained in:
parent
3a45e25409
commit
c6c62e5852
1 changed files with 42 additions and 0 deletions
42
examples/InputValueExample/README.md
Normal file
42
examples/InputValueExample/README.md
Normal file
|
|
@ -0,0 +1,42 @@
|
|||
# InputValueExample
|
||||
|
||||
This example demonstrates how to get and set input element values using Crafter.CppDOM.
|
||||
|
||||
## Features
|
||||
|
||||
- Shows how to get input element values using GetValue()
|
||||
- Demonstrates how to set input element values using SetValue()
|
||||
- Illustrates updating UI elements based on input changes
|
||||
- Shows how to reset input values
|
||||
|
||||
## Usage
|
||||
|
||||
```cpp
|
||||
import Crafter.CppDOM;
|
||||
import std;
|
||||
using namespace Crafter;
|
||||
|
||||
HtmlElement* body = new HtmlElement("body", R"(<h1>Input GetValue() and SetValue() Example</h1><br><input id="input" type="text" placeholder="Enter your text here..."><br><button id="button">Change Value</button><p id ="valueOutput"></p>)");
|
||||
HtmlElement* button = new HtmlElement("button");
|
||||
HtmlElement* output = new HtmlElement("valueOutput");
|
||||
HtmlElement* input = new HtmlElement("input");
|
||||
|
||||
int main(){
|
||||
button->AddClickListener([](Crafter::MouseEvent) {
|
||||
std::string newValue = input->GetValue();
|
||||
output->SetInnerHTML(newValue);
|
||||
input->SetValue("");
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
## Building and Running
|
||||
|
||||
```bash
|
||||
crafter-build build executable
|
||||
./run.sh
|
||||
```
|
||||
|
||||
Then navigate to `http://localhost:8080/` in your browser.
|
||||
|
||||
If caddy is not installed, you can use your favorite static file server instead.
|
||||
Loading…
Add table
Add a link
Reference in a new issue