Record some values in one page and then store it in another page.

I am trying to create a booking form to provide bike service where on the selection of bike company and bike model, details like service charge and spare parts price comes up from a database. I have been able to do upto this. After pressing the continue button I want to take the user to booking page, where details like Bike Company, Bike Model, Service charge, Spare part Charge are already filled by the details from the previous page. I linked the values to a dataset on the first page and then stored the current id in session memory. When I am retrieving this id on the booking page and show the required details it is not working.
I am new to wix and have basically no idea of coding. Any help is very much appreciated. Thanks in advance.

Coding on First Page:
import wixData from ‘wix-data’ ;
import { session } from ‘wix-storage’ ;

$w . onReady ( function () {

uniqueDropDown1 ();

});

export function button11_click ( event ) {
$w ( ‘#box4’ ). expand ();
$w ( ‘#box1’ ). show ();
}

function uniqueDropDown1 (){

wixData . query ( “ClutchPlateChange” )

. limit ( 1000 )

. find ()

. then ( results => {

const uniqueTitles = getUniqueTitles ( results . items );

$w ( “#dropdown1” ). options = buildOptions ( uniqueTitles );

});

function getUniqueTitles ( items ) {

const titlesOnly = items . map ( item => item . company );

return [… new Set ( titlesOnly )];

}

function buildOptions ( uniqueList ) {

return uniqueList . map ( curr => {

return { label : curr , value : curr };

});

}

}

export function dropdown1_change ( event , $w ) {

uniqueDropDown2 ();

$w ( “#dropdown2” ). enable ();

}

function uniqueDropDown2 (){

wixData . query ( “ClutchPlateChange” )

. contains ( “company” , $w ( “#dropdown1” ). value )

. limit ( 1000 )

. find ()

. then ( results => {

const uniqueTitles = getUniqueTitles ( results . items );

$w ( “#dropdown2” ). options = buildOptions ( uniqueTitles );

});

function getUniqueTitles ( items ) {

const titlesOnly = items . map ( item => item . model );

return [… new Set ( titlesOnly )];

}

function buildOptions ( uniqueList ) {

return uniqueList . map ( curr => {

return { label : curr , value : curr };

});

}

}

export function dropdown2_change ( event ) {
$w ( “#button3” ). enable ();
}

export function button3_click ( event , $w ) {
$w ( ‘#box6’ ). show ();

wixData . query ( “ClutchPlateChange” )
. eq ( “model” , $w ( ‘#dropdown2’ ). value )
. find ()
. then ( ( results ) => {
if ( results . items . length > 0 ) {
let firstItem = results . items [ 0 ];
$w ( ‘#input8’ ). value = firstItem . serviceCharge ;
$w ( ‘#input9’ ). value = firstItem . sparePrice ;
$w ( ‘#input5’ ). value = firstItem . serviceType ;
$w ( ‘#input6’ ). value = firstItem . company ;
$w ( ‘#input7’ ). value = firstItem . model ;
}

})
. catch ( ( err ) => {
let errorMsg = err ;
});
}

export function button13_click ( event ) {
$w ( ‘#box4’ ). collapse ();
}

export function button4_click ( event , $w ) {

session . setItem ( ‘serviceid’ , $w ( ‘#dataset1’ ). getCurrentItem ()._id );

}

Coding on Booking Page

import { session } from ‘wix-storage’ ;

import wixData from ‘wix-data’ ;

$w . onReady ( function () {
// here comes the initialization code
let serviceid = session . getItem ( ‘serviceid’ );

wixData . query ( “BookingDetails” )
. eq ( “_id” , serviceid )
. find ()
. then ( ( results ) => {
if ( results . items . length > 0 ) {
let items = results . items ;
let item = items [ 0 ];
$w ( “#input1” ). value = item . bikeCompany ;
$w ( “#input2” ). value = item . bikeModel ;
$w ( “#input3” ). value = item . estimatesServiceCharge ;
$w ( “#input4” ). value = item . estimatedSparePrice ;
console . log ( item . _id )
}
else {
$w ( “#input1” ). value = “0.00” ;
$w ( “#input2” ). value = “1.00” ;
}
} )
. catch ( ( error ) => {
let errorMsg = error . message ;
let code = error . code ;
} );

});

Screenshot of 1st page

Screenshot of booking page