calling function with web3 is not working correctly?

Question

I have a problem like this. I have built a smart contract and have deployed it to the infura network. All other functions are working correctly when interacting with web3 but when I calling one function it gives me an error by saying that

__WEBPACK_IMPORTED_MODULE_4__ethereum_factory__.a.methods.getDeployedContract is not a function

This is how I am interacting with it.

import React,{ Component } from 'react';
import { Button, Form, Grid, Message } from 'semantic-ui-react';

import web3 from '../ethereum/web3';
import factory from '../ethereum/factory';
import Driver from '../ethereum/driver';

import Layout from './Layout';
import Header from './Header';


export default class Dofine extends Component {
  state ={
    offenceId: 0,
    location: '',
    driver: 0
  };

  handleChange = (event) => {
    this.setState({
        offenceId: event.target.value
    });
}


  onSubmit = async (event) =>{
    event.preventDefault();
    this.setState({ loading: true, errorMessage: ''});
    console.log(this.state.driver);
    console.log(this.state.offenceId);

    try{
      const accounts = await web3.eth.getAccounts();
      const driverCd = await factory.methods.getDeployedContract(this.state.driver).call();

      // const driver = Driver(driverCd);
      // const user = driver.methods.getDetails().call();
      console.log(driverCd);

      // await factory.methods.doFine(this.state.offenceId,this.state.location,this.state.driver)
      //   .send({
      //       gas:"3000000",
      //       from: accounts[0]
      //   });

    }catch(err){
      this.setState({ errorMessage: err.message})
    }

    this.setState({ loading: false});
  }
    render(){
        return(
          <div>
          <Header></Header>
          <Layout>
            <Grid>
              <Grid.Row>
              <Grid.Column width={5}></Grid.Column>
              <Grid.Column width={6}>
           <Form onSubmit={this.onSubmit} error={!!this.state.errorMessage}>
             <center><h3>Do Fine</h3></center>
              <Form.Field>
                <label>Offence</label>
                <select value={this.state.offenceId} onChange ={this.handleChange}>
                    <option value="1">Overtake on the Zebra Crossing</option>
                    <option value="2">Overtake On the Left</option>
                    {/* <option value="coconut">Coconut</option>
                    <option value="mango">Mango</option> */}
                </select>
              </Form.Field>
              <Form.Field>
                <label>Location</label>
                <input placeholder='Colombo'  value={this.state.location}
                        onChange ={event => this.setState({ location: event.target.value})}/>
              </Form.Field>
              <Form.Field>
                <label>Address Of the Driver</label>
                <input placeholder='0xdCF0A9F8413B1229E426DF2dE76873150d8B1c9B'  value={this.state.driver}
                        onChange ={event => this.setState({ driver: event.target.value})}/>
              </Form.Field>
              <Message error header="Oops!" content={this.state.errorMessage} />
                    <Button loading={this.state.loading} color="green" basic>Do Fine</Button> <Button  loading={this.state.loading} color="red" basic >Clear</Button>
            </Form>
            </Grid.Column>
            </Grid.Row>
            </Grid>
            </Layout>

            </div>

        )
    }
}

This is my factory contract.

pragma solidity ^0.4.17;

contract Driverfactory{

    struct Driver {
        address contractd;
        address account;
    }

    address[] private deployedDriverContracts;

    mapping(address=>Driver) public drivers;

    function createDriver(string lisenceId,string firstName,string lastName,string vehicle,string vehicleType) public{
        require(msg.sender!=drivers[msg.sender].account);
        address newDriver = new DriverProfile(lisenceId,firstName,lastName,vehicle,vehicleType,msg.sender);
        deployedDriverContracts.push(newDriver);
        Driver  memory newDriver1 = Driver({
            contractd:newDriver,
            account:msg.sender
        });
        drivers[msg.sender] = newDriver1;
    }

    function getDeployedDriverContracts() public view returns(address[]){
        return deployedDriverContracts; 
    }

    function checkDriver(address driver) public view returns(bool){
        if(driver==drivers[driver].account){
            return true;
        }

        else{
            return false;
        }

    }

    function driverContract(address driver) public view returns(address){
        address dc_adrs =drivers[driver].contractd;
        return dc_adrs;
    }



}



contract DriverProfile{
    struct Driver{
        string lisenceId;
        string firstName ;
        string lastName; 
        address account;
        string vehicle;
        string vehicleType;
        uint totalOffenceAmount;
        uint offenceCount;
        uint pendingPayments;
        mapping(uint=>Fine)  fines;
    }

    Driver public driver;

    constructor(string lisenceId,string firstName,string lastName,string vehicle,string vehicleType,address owner) public{
        driver = Driver({
            lisenceId:lisenceId,
            lastName:lastName,
            firstName:firstName,
            account:owner,
            vehicle:vehicle,
            vehicleType:vehicleType,
            totalOffenceAmount:0,
            offenceCount:0,
            pendingPayments:0
        });
    }





}

And That is work fine when I interact with the deployed contract through Remix editor. Can someone help me to solve this problem? Thank You.

Answer 1

The function in your contract is

getDeployedDriverContracts()

And in the error you see it is

ethereum_factory__.a.methods.getDeployedContract is not a function

The incorrect spelling must be causing the error.