QML TableView get data from specific cell (selected row + specific column)

Question

I have QML TableView with QSqlQueryModel. I need to select any row and get data from every column of table to separate TextField.

Here is abonentstable.h:

#pragma once

#include <QObject>
#include <QSqlQueryModel>

class AbonentsSqlModel : public QSqlQueryModel
{
    Q_OBJECT

public:
    explicit AbonentsSqlModel(QObject *parent = 0);

    void setQuery(const QString &query, const QSqlDatabase &db = QSqlDatabase());
    QVariant data(const QModelIndex &index, int role) const;
    QHash<int, QByteArray> roleNames() const { return m_roleNames; }

private:
    void generateRoleNames();
    QHash<int, QByteArray> m_roleNames;
};

abonentstable.cpp:

#include "abonentstable.h"

#include <QSqlRecord>
#include <QSqlField>

AbonentsSqlModel::AbonentsSqlModel(QObject *parent) : QSqlQueryModel(parent)
{
    QSqlDatabase db = QSqlDatabase::addDatabase("QSQLITE");
    db.setDatabaseName("data_base.sqlite");
    db.open();
}

void AbonentsSqlModel::setQuery(const QString &query, const QSqlDatabase &db)
{
    QSqlQueryModel::setQuery(query, db);
    generateRoleNames();
}

void AbonentsSqlModel::generateRoleNames()
{
    m_roleNames.clear();
    for( int i = 0; i < record().count(); i ++) {
        m_roleNames.insert(Qt::UserRole + i + 1, record().fieldName(i).toUtf8());
    }
}

QVariant AbonentsSqlModel::data(const QModelIndex &index, int role) const
{
    QVariant value;

    if(role < Qt::UserRole) {
        value = QSqlQueryModel::data(index, role);
    }

    else {
        int columnIdx = role - Qt::UserRole - 1;
        QModelIndex modelIndex = this->index(index.row(), columnIdx);
        value = QSqlQueryModel::data(modelIndex, Qt::DisplayRole);
    }

    return value;
}

Table.qml:

TableView {
    id: table

    model: abonents

    ....

    TableViewColumn {
        delegate: Text {
            text: " " + model.name + " " + model.surname
            font.pointSize: 20
        }    
        width: 575
    }

    TableViewColumn {
        delegate: Text {
            text: " " + model.phone
            font.pointSize: 20
        }    
        width: 575
    }

    TableViewColumn {
        delegate: Text {
            text: " " + model.ip_address
            font.pointSize: 20
        }    
        width: 525
    }
}

And some text fields:

TextField {
    id:  leftText
}

TextField {
     id:  centerText
}

TextField {
    id:  rightText
}

This sqlite table has 4 columns, and I need to get data from selected row to those text fields: 2 columns to left, 1 to center and 1 to right.

Tarod Tarod · Accepted Answer · 2015-10-06T08:37:17

When the user clicks a valid row it is emitted the clicked(int row) signal. Then, you can get the values for that row, format the text depending on your requirements and set the values in the three TextField. For example, in your case:

TableView {
    id: table

    model: abonents

    ... (your TableViewColumn components) ...    

    onClicked: {
        leftText.text = abonents.get(row).name + " " + libraryModel.get(row).surname;
        centerText.text = abonents.get(row).phone;
        rightText.text = abonents.get(row).ip_address;
    }
}

Please, let me please use my own answer to show you a complete example:

import QtQuick 2.2
import QtQuick.Window 2.2
import QtQuick.Controls 1.4

ApplicationWindow {
    id: window
    visible: true
    title: "Table View Example"

    TableView {
        y: 70
        width: 500

        TableViewColumn {
            role: "title"
            title: "Title"
            width: 100
        }
        TableViewColumn {
            role: "author"
            title: "Author"
            width: 100
        }

        TableViewColumn{
            width: 300
            delegate: Text {
                text: model.title + " "  + model.author
                font.family: "Courier New"
                font.pixelSize: 18
                color: "red"
            }
        }

        onClicked: {
            leftText.text = libraryModel.get(row).title + " " + libraryModel.get(row).author;
            centerText.text = libraryModel.get(row).title;
            rightText.text = libraryModel.get(row).author;
        }

        model: libraryModel

        ListModel {
            id: libraryModel
            ListElement {
                title: "A Masterpiece"
                author: "Gabriel"
            }
            ListElement {
                title: "Brilliance"
                author: "Jens"
            }
            ListElement {
                title: "Outstanding"
                author: "Frederik"
            }
        }
    }

    TextField {
        id:  leftText
    }

    TextField {
        id:  centerText
        anchors.left: leftText.right
    }

    TextField {
        id:  rightText
        anchors.left: centerText.right
    }
}

QML TableView get data from specific cell (selected row + specific column)

1 Answers