jeudi 7 mars 2019

Insert Web Api rest Values (Json return) into html form (Get method)

I'm trying to insert a get method in my html page (Body.onload) that actually full some form fields from this json web api result automaticly.

I'm looking for several answers, but none of then seens clear to me.

I checked out angularJS, Django, Html bindign, but i feel like lost in this one. Could anyone give me a north?

Thanks in advance,

Daniel.

My form:

<form method="get" id="form" name="form" enctype="application/json" onsubmit="return checkForm(this)" action="/api/Business_Register">
                CNPJ: <input type="number" name="BusinessRegister" placeholder="Insira o número do CNPJ" required style="background-color:#292a60; width:100%" />
                SENHA: <input type="password" name="Password" placeholder="Insira a senha (mínimo de seis dígitos)" required style="background-color:#292a60;width:100%" />
                CONFIRME A SENHA: <input type="password" name="ConfirmPassword" placeholder="Confirme a senha" required style="background-color:#292a60;width:100%" />
                Razão Social: <input type="text" name="BusinessName" placeholder="Insira o nome da empresa" required style="background-color:#292a60;width:100%" />
                Nome Fantasia: <input type="text" name="BusinessFantasyName" placeholder="Insira nome fantasia da empresa" required style="background-color:#292a60;width:100%" />
                Área: <input list="Area1List" id="Area1Field" name="BusinessArea" placeholder="Insira a área de atuação da empresa" required style="background-color:#292a60;width:100%" />
                <input type="hidden" id="BusinessSpecificArea" name="BusinessSpecificArea" placeholder="Insira a área especifica da empresa" style="background-color:#292a60;width:100%" />
                País de Atuação: <input type="text" name="Country" placeholder="Insira o país de localização de seu estabelecimento" required style="background-color:#292a60;width:100%" />
                Estado: <input type="text" name="State" placeholder="Insira o estado de localização de seu estabelecimento" required style="background-color:#292a60;width:100%" />
                Cidade: <input type="text" name="City" placeholder="Insira a cidade de localização de seu estabelecimento" required style="background-color:#292a60;width:100%" />
                Bairro: <input type="text" name="Neighbourhood" placeholder="Insira o bairro de localização de seu estabelecimento" required style="background-color:#292a60;width:100%" />
                Logradouro: <input type="text" name="Address" placeholder="Insira a rua localização de seu estabelecimento" required style="background-color:#292a60;width:100%" />
                Numero: <input type="text" name="Number" placeholder="Insira o numero de seu estabelecimento" required style="background-color:#292a60;width:100%" />
                Complemento: <input type="text" name="Apartment" placeholder="Insira um complemento, caso existente" required style="background-color:#292a60;width:100%" />
                <input type="hidden" id="Latitude" name="Latitude" required style="background-color:#292a60;width:100%" />
                <input type="hidden" id="Longitude" name="Longitude" required style="background-color:#292a60;width:100%" />
                <input type="hidden" name="DateofReg" id="DateofReg" placeholder="Insira a área especifica da empresa" style="background-color:#292a60;width:100%" />
                <input type="hidden" name="DateofMod" id="DateofMod" placeholder="Insira a área especifica da empresa" style="background-color:#292a60;width:100%" />
                <input type="hidden" name="BusinessStatus" id="BusinessStatus" placeholder="Insira a área especifica da empresa" style="background-color:#292a60;width:100%" />
                Nome do responsável: <input type="text" name="RegisteredBy" placeholder="Insira o nome do responsável pelo cadastro" required style="background-color:#292a60;width:100%" />
                Email para contato: <input type="text" name="ContactEmail" placeholder="Insira o email de contato da empresa" required style="background-color:#292a60;width:100%" />
                Telefone para contato: <input type="text" name="ContactPhone" placeholder="Insira o Telefone de contato da empresa com DDD (Sem espaços)" required style="background-color:#292a60;width:100%" />
                <input type="hidden" name="InternetSupplierIndex" id="InternetSupplierIndex" placeholder="Insira a área especifica da empresa" style="background-color:#292a60;width:100%" />

                <datalist id="Area1List">
                    <option value="Academia">
                    <option value="Academia de armas de fogo">
                    <option value="Academia de boxe">
                    <option value="Academia de boxe tailandês de Muay">
                    <option value="Academia piscina">
                                        </datalist>


                <div><button class="button">Enviar</button></div>


            </form>

My json file:

<?xml version="1.0" encoding="ISO-8859-1"?>
<ArrayOfBusiness_Register     xmlns="http://schemas.datacontract.org/2004/07/IcquireAdoNet"      xmlns:i="http://www.w3.org/2001/XMLSchema-instance">
<Business_Register>
<Address>????</Address>
<Apartment>????</Apartment>
<BusinessArea>Alimentação</BusinessArea>
<BusinessFantasyName>Panceira</BusinessFantasyName>
<BusinessName>Panceira</BusinessName>
<BusinessRegister>1</BusinessRegister>
<BusinessSpecificArea>Salgados</BusinessSpecificArea>
<BusinessStatus>Pendente</BusinessStatus>
<City>Rio Grande</City>
<ContactEmail>Panceira@panceira.com.br</ContactEmail>
<ContactPhone>99999999</ContactPhone>
<Country>Brasil</Country>
<DateofMod>2019-02-27T00:00:00</DateofMod>
<DateofReg>2019-02-27T00:00:00</DateofReg>
<InternetSupplierIndex>TuNvAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=</InternetSupplierIndex>
<Latitude>-32.17278163</Latitude>
<Longitude>-52.17111281</Longitude>
<Neighbourhood>Cassino</Neighbourhood>
<Number>???</Number>
<Password>Dan</Password>
<RegisteredBy>Dona do  Panceira</RegisteredBy>
<State>RS</State>
</Business_Register>

My Rest Model

 public class BusinessReg
{
    public int BusinessRegister { get; set; }
    public string BusinessName { get; set; }
    public string BusinessFantasyName { get; set; }
    public string BusinessArea { get; set; }
    public string BusinessSpecificArea { get; set; }
    public string Country { get; set; }
    public string State { get; set; }
    public string City { get; set; }
    public string Address { get; set; }
    public string Number { get; set; }
    public string Apartment { get; set; }
    public string Neighbourhood { get; set; }
    public decimal Latitude { get; set; }
    public decimal Longitude { get; set; }
    public System.DateTime DateofReg { get; set; }
    public Nullable<System.DateTime> DateofMod { get; set; }
    public string BusinessStatus { get; set; }
    public string RegisteredBy { get; set; }
    public byte[] InternetSupplierIndex { get; set; }
    public string Password { get; set; }
    public string ContactEmail { get; set; }
    public string ContactPhone { get; set; }
} 




Aucun commentaire:

Enregistrer un commentaire