Sukarma
Sukarma

Reputation: 55

How to Get values from each line in text field?

I have textfield with input : Foo /line1 Bar /line2

when I click button submit, i create widgets 'Name :' with the value that was submitted (name=foo and name=bar), how I create and get value from that textfield? do I have to make a list view builder first?

can anyone give an example,

  String txt = "";
  TextEditingController controllerTxt = new TextEditingController();

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: Text('Create'),
        actions: <Widget>[
          FlatButton(
            child: Text('Submit'),
            textColor: Colors.white,
            onPressed: () {
              Navigator.pushNamed(context, '/ResultPage',
                  arguments: (controllerTxt.text));
            },
          ),
        ],
      ),
      body: new ListView(
        children: <Widget>[
          new Container(
            child: new Column(
              children: <Widget>[
                  new TextField(
                    controller: controllerTxt,
                    maxLines: 25,
                  ),
              ],
            ),
          ),
        ],
      ),
    );
  }

class _ResultPageState extends State<ResultPage> {
  String result;

  @override
  Widget build(BuildContext context) {
    RouteSettings settings = ModalRoute.of(context).settings;
    result = settings.arguments;

    return new Scaffold(
      appBar: new AppBar(
        title: Text('Create'),
        actions: <Widget>[
        ],
      ),
      body: new Container(
        padding: EdgeInsets.all(10.0),
        child: new Row(
          children: <Widget>[
            new Text('Name : '),
            Expanded(
              child: new TextField(
              enabled: false,
              decoration: new InputDecoration(
                border: new OutlineInputBorder(
                    borderSide: new BorderSide(color: Colors.black)),
                labelText: ('${result}'),
              ),
            )),
          ],
        ),
      ),
    );
  }
}

Upvotes: 2

Views: 1110

Answers (1)

According to what I understood here's my solution

So I assume you have multilines text field

enter image description here

and you want something like this

enter image description here

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  TextEditingController controllerTxt = new TextEditingController();

  @override
  void initState() {
    super.initState();
  }

  String txt = "";

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: Text('Create'),
        actions: <Widget>[
          FlatButton(
            child: Text('Submit'),
            textColor: Colors.white,
            onPressed: () {
              Navigator.push(
                  context,
                  MaterialPageRoute(
                      builder: (context) => ResultPage(
                            result: controllerTxt.text,
                          )));
            },
          ),
        ],
      ),
      body: new ListView(
        children: <Widget>[
          new Container(
            child: new Column(
              children: <Widget>[
                new TextField(
                  controller: controllerTxt,
                  maxLines: 25,
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class ResultPage extends StatefulWidget {
  final String result;

  const ResultPage({Key key, this.result}) : super(key: key);

  @override
  _ResultPageState createState() => _ResultPageState();
}

class _ResultPageState extends State<ResultPage> {
  List<String> lines;

  @override
  void initState() {
    super.initState();

    lines = widget.result.split('\n');
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: Text('Create'),
          actions: <Widget>[],
        ),
        body: Column(
          children: lines
              .map((line) => Container(
                    padding: EdgeInsets.all(10.0),
                    child: new Row(
                      children: <Widget>[
                        new Text('Name : '),
                        Expanded(
                            child: new TextField(
                          enabled: false,
                          decoration: new InputDecoration(
                            border: new OutlineInputBorder(
                                borderSide:
                                    new BorderSide(color: Colors.black)),
                            labelText: (line),
                          ),
                        )),
                      ],
                    ),
                  ))
              .toList(),
        ));
  }
}


Upvotes: 1

Related Questions