logo-softwarestudio-2020-600

j_insert_update – zaawansowane programowanie – wstawianie tabeli

StudioSystem zapewnia również użytkownikom zaawansowane możliwości programistyczne. Jego język skryptowy oparty jest na JavaScript i ułatwia tworzenie złożonych aplikacji. Dodatkowo platforma oferuje obszerną dokumentację i samouczki, które ułatwiają naukę języka i szybkie rozpoczęcie pracy.

StudioSystem zapewnia użytkownikom solidną i wszechstronną platformę do produkcji multimediów cyfrowych. Jego zaawansowane funkcje, zintegrowany zestaw narzędzi i charakter open source sprawiają, że jest to atrakcyjny wybór zarówno dla doświadczonych, jak i początkujących użytkowników. Zaawansowane możliwości programistyczne zapewniają również użytkownikom bogactwo możliwości tworzenia unikalnych i wciągających multimediów cyfrowych.

W transakcji j_insert_update można wykorzystując JQuery i funkcje StudioSystem wstawiać dowolne obiekty na formularzu. Wykorzystujemy do tego typ danych Div. Artykuł zawiera opis który w polu typu Div dodaje tablę z danymi powiązanymi.

Wstawianie tabeli przedstawię na przykładzie kartoteki kontrahenta, dla którego chcemy w dodatkowej zakładce wyświetlić w tabeli listę kontaktów.

Chcemy więc osiągnąć coś takiego, dodatkowa zakładka kontakty, a w niej tabelka:

insert_update tabelka

Krok 1 – dodaj obiekt typu Div

W konfiguracji transakcji insert_update dodajemy wiersz definiujący obiekt typu Div w następujący sposób:

  • W kolumnie nazwa przypisujemy unikalny identyfikator np. TABELKA
  • W kolumnie zakładka podajemy nową nazwę zakładki np. Kontakty
  • W kolumnie tytuł podajemy
insert_update div

Krok 2 – plik js

Funkcja tworząca tabelę

W dołączonym pliku js dodajemy funkcje która będzie tworzyła tabelę na podstawie zapytania, gdzie warunek where ogranicza ilość wierszy to tych które dotyczą danego kontrahenta. Zmienną unikalną danego wywołania nazywa się gcRefno i zawiera wartość przekazaną przy uruchamianiu transakcji j_insert_update.aspx w parametrze refno. Jako parametr do funkcji przekazujemy nazwę kontrolki w jakiej ma być umieszczona tabelka, w naszym przykładzie będzie to TABELKA.

function UstawTable(cKontrolka) {
 var idGrid = 'grid' + cKontrolka;
 $('#' + cKontrolka).html("<div id='" + idGrid + "'></div>");
 var cZrodlo = PobierzDataTable("UPPER([NRIDCRM]) AS NRIDCRM, [NAZWA],[KODPOCZTOWY],[MIEJSCOWOSC],[ULICA],[TELEFON],[MAIL],[NAZWISKO],[STANOWISKO] FROM [kncrm] where nridodn=" + gcRefno);

 var source =
 {
 datatype: "json",
 datafields: [
 { name: 'NAZWA', type: 'string' },
 { name: 'KODPOCZTOWY', type: 'string' },
 { name: 'MIEJSCOWOSC', type: 'string' },
 { name: 'ULICA', type: 'string' },
 { name: 'TELEFON', type: 'string' },
 { name: 'MAIL', type: 'string' },
 { name: 'NAZWISKO', type: 'string' },
 { name: 'STANOWSIKO', type: 'string' }
 ],
 localdata: cZrodlo,
 id: 'NRIDCRM'
 };
 var dataAdapter = new $.jqx.dataAdapter(source);

 $("#" + idGrid).jqxGrid(
 {
 theme: 'energyblue',
 height: '90%',
 width: '100%',
 source: dataAdapter,
 altrows: true,
 columns: [
 { text: 'Nazwisko', datafield: 'NAZWISKO', width: 200 },
 { text: 'Nazwa', datafield: 'NAZWA', width: 200 },
 { text: 'Kod', datafield: 'KODPOCZTOWY', width: 80 },
 { text: 'Miejscowość', datafield: 'MIEJSCOWOSC', width: 150 },
 { text: 'Ulica', datafield: 'ULICA', width: 150 },
 { text: 'Telefon', datafield: 'TELEFON', width: 150 },
 { text: 'e-mail', datafield: 'MAIL', width: 250 },
 { text: 'Stanowisko', datafield: 'STANOWISKO', width: 200 }
 ]
 });

 JqxFormatujGrid('#' + idGrid);
}

Uruchomienie funkcji tworzącej tabelkę

W celu pojawienia się tabelki na formularzu w funkcji uruchamianej  onload dodajemy jej wykonanie, w raz nazwę kontrolki w jakiej tabela ma się pojawić np.:

function MojaOnLoad() {
UstawTable('TABELKA');
}