Jump to content

MySQL para JSON para JS


CbayV
 Share

Recommended Posts

Boas,

Tendo em conta que sou novo no forum vou fazer uma breve apresentação. Sou programador freelancer e trabalho há alguns anos essencialmente com CSS, PHP e HTML.

E é por essa razão que estou com alguns problemas com o presente projecto. Neste trabalho tenho que seleccionar dados da bd para um ficheiro json e utiliza-los em funções presentes num ficheiro javascript. Devido aos meus limitados conhecimentos em javascript tenho andado à procura de soluções mas infelizmente está complicado. Vou colocar aqui a descrição do que preciso para o caso de alguem conseguir ajudar.

--

1 - Neste momento é chamado para uma função (iniciar_tons) que está no ficheiro personalizador.js os dados de um ficheiro já existente chamado dados.json

var cur_tons = dados['name'].tons;
alert (Tons= " + cur_tons);

Desta forma tudo corre bem, os dados aparecem na caixa de alerta e a função apresenta os dados que estão no dados.json. Mas este é um ficheiro que já está no servidor e é editado à mão.

2 - O objectivo é que os dados a entrar na função (iniciar_tons) que está no ficheiro personalizador.js venham da base de dados

Após alguma pesquisa fiz o seguinte código dentro de um php chamado "selecciona_bd" que está na mesma pasta que o dados.json. O que este código faz é criar uma saída json, que terá o mesmo efeito que um ficheiro json (pelo menos é o que eu acho).

include"config.php";

$var = array();
$sql = "SELECT * FROM tabela_tons";
$result = mysqli_query($con, $sql);

while($obj = mysqli_fetch_object($result)) {
$var[] = $obj;
}
$json_result = json_encode($var);

A rotina vai buscar todos os dados da tabela. Fazendo um echo são todos apresentados na tela. O que me leva a pensar que até aqui está tudo ok.

3 - Agora onde encalhei e não consigo resolver:

Como é que eu passo os dados que recolhi da base de dados para a variavel json "cur_tons" que será utilizada na função iniciar_tons do ficheiro personalizador.js. Ou seja, como é que eu faço a substituição desta linha no ficheiro js ( var cur_tons = dados['name'].tons; )?

------------

Penso que seja algo deste tipo:

var cur_colors = JSON.parse(json_result);

No entanto não consigo que nada seja apresentado, nem no alert, nem na função.

Se alguém puder ajudar agradeço.

Cumps

Link to comment
Share on other sites

Das duas uma, ou imprimes o resultado do PHP directamente para a variável javascript, ou fazes um pedido ajax ao PHP (que apenas te deve devolver o JSON).

“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Link to comment
Share on other sites

Bem, agora surgiu um novo problema, que vou tentar explicar.

Tenho a função que recebe como Json os dados de um php. Os dados chegam como quero à função e consigo multiplicar as div's de acordo com o numero de registos que vem da bd, sendo que cada div mostra o conteúdo do campo "nome" que vem da bd.

O problema está que depois ao clicar numa das divs devo apresentar o conteúdo do campo "codigo" noutra div. Mas não consigo que o valor da variavel var_codigo fique disponível no botão.

Deixo aqui o codigo. Se alguem puder ajudar agradeço.

function inicializa_dados(){

$('.content1, .content2').append('<div class="personaliza"></div>');

$.ajax ({

url: "personaliza/json/selecciona_db.php", //php onde faço a query de selecção;

context: document.body,
async: false,
success: function(data){
var dados_correntes = JSON.parse(data);

for (var i = 0; i < dados_correntes.length; i++) {

var var_codigo = dados_correntes[i].codigo;
var var_nome = dados_correntes[i].nome;

$('.personaliza').append('<div></div>');
$('.personaliza div:last-child').append('<span id="sp1">'+var_nome+'</span>');

};
  }
});


$('.area1 .personaliza > div').on('click', function(){


alert(var_nome);
//Como é que consigo trazer para aqui o valor da variavel var_nome referente à div que foi clicada?
//Esse valor será depois exibido noutra div, acção que consigo fazer, o problema é mesmo trazer para aqui o valor da variavel.

});
}

Obrigado

Link to comment
Share on other sites

Tens várias formas. Uma é colocares como atributo no span e vais buscar o valor quando há o click:

$('.personaliza').append('<div></div>');
$('.personaliza div:last-child').append('<span id="sp1" data-codigo="'+ var_codigo +'">'+var_nome+'</span>');

};

$('.area1 .personaliza > div').on('click', function(ev){
   var var_codigo = $(ev.currentTarget).attr('data-codigo');
});

“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Link to comment
Share on other sites

Obrigado KTachyon, tentei da forma que disseste mas continuo a receber a variável sem conteúdo

Não dá para ao clicar no botão passar o conteúdo do span para uma variável com o getElementById() ou algo teste género?

Link to comment
Share on other sites

Se estivesse à procura de informação a partir de um identificador que é efectivamente único a resposta era sim. Mas como estás a utilizar um nome existe a possibilidade de existirem coisas com o mesmo nome o que te pode criar um problema.

Criei um exemplo no jsfiddle: http://jsfiddle.net/hhyp9m3t/

“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Link to comment
Share on other sites

Obrigado pelo exemplo.

Se replicar o que fizeste no exemplo consigo mas no js continuo sem conseguir.

Terá alguma influencia o facto do loop criar div's e não botões ou o facto da rotina (entrada das variáveis do Json, loop dos registos e tentativa de visualização da variavel) ser toda feita no ficheiro js?

Link to comment
Share on other sites

Ser uma div não tem influência: http://jsfiddle.net/axk0sdq0/

Mas repara que eu não conheço a tua implementação. A minha sugestão é que inspecciones o código na ferramenta do browser. Se for necessário, coloca alguns console.log no código para ver o que é que está a ser retornado (em vez de alert, que é muito intrusivo). Coloca classes nas divs que crias para facilitar a implementação e a leitura do código. Por exemplo:

$('.personaliza').append('<div></div>');
$('.personaliza div:last-child').append('<span id="sp1" data-codigo="'+ var_codigo +'">'+var_nome+'</span>');

Ficava melhor assim:

var newDiv = $('<div class="sp-holder"></div>');
newDiv.append('<span id="sp1" data-codigo="'+ var_codigo +'">'+var_nome+'</span>');
$('.personaliza').append(newDiv);

Já agora - e só reparei agora nisto - não deves ter mais do que um elemento no DOM com o mesmo id. Os teus <span> estão a ser todos criados com 'sp1'.

“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.